@sc-360-v2/storefront-cms-library 0.4.25 → 0.4.27

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 (49) hide show
  1. package/dist/add-order.scss +8 -8
  2. package/dist/add-products-tab.scss +50 -0
  3. package/dist/allocationDetails.scss +2 -2
  4. package/dist/allocations.scss +6 -6
  5. package/dist/builder.js +1 -1
  6. package/dist/bundle.scss +3 -1
  7. package/dist/bundleDetails copy.scss +1431 -0
  8. package/dist/bundleDetails.scss +3054 -107
  9. package/dist/button.scss +5 -2
  10. package/dist/buy-for-tab-container.scss +2 -1
  11. package/dist/buy-for-tab.scss +32 -21
  12. package/dist/buyForHeaders.scss +4543 -4081
  13. package/dist/buyForPopup.scss +140 -116
  14. package/dist/cart-details.scss +1 -1
  15. package/dist/cart-products-sidebar.scss +18 -56
  16. package/dist/cart-summary.scss +12 -11
  17. package/dist/dropdownTemplate.scss +5 -0
  18. package/dist/functions.js +1 -1
  19. package/dist/functions.scss +4 -0
  20. package/dist/global-styles.scss +86 -0
  21. package/dist/icons.js +1 -1
  22. package/dist/index.js +1 -1
  23. package/dist/language-selector.scss +4 -1
  24. package/dist/modal.scss +37 -27
  25. package/dist/multi-select-dropdown.scss +241 -0
  26. package/dist/option-bar.scss +2 -2
  27. package/dist/order-status.scss +18 -14
  28. package/dist/product-actions.scss +27 -27
  29. package/dist/product-price.scss +1908 -1428
  30. package/dist/product-sizechart.scss +5 -2
  31. package/dist/quantity-selector.scss +6 -6
  32. package/dist/quick-order-pad.scss +106 -42
  33. package/dist/repeater-embla-controls.scss +4 -2
  34. package/dist/repeater.scss +3 -3
  35. package/dist/search.scss +11 -1
  36. package/dist/section.scss +9 -9
  37. package/dist/shipping-payments.scss +5 -0
  38. package/dist/text-temp-v2.scss +1 -2
  39. package/dist/types/builder/elements/common.d.ts +1 -0
  40. package/dist/types/builder/elements/light-box-v2/index.d.ts +1 -0
  41. package/dist/types/builder/elements/section/index.d.ts +1 -0
  42. package/dist/types/builder/tools/element-edit/bundleDetails.d.ts +5 -0
  43. package/dist/types/builder/tools/element-edit/language-menu.d.ts +1 -0
  44. package/dist/types/builder/tools/element-edit/productPrice.d.ts +2 -1
  45. package/dist/types/builder/tools/element-edit/variantPicker.d.ts +2 -0
  46. package/dist/types/website/constants/data-connector-souces.d.ts +13 -6
  47. package/dist/website.js +1 -1
  48. package/dist/widget.scss +2 -0
  49. package/package.json +1 -1
@@ -1,5 +1,6 @@
1
1
  @use "sass:map";
2
2
  @use "sass:list";
3
+ @use "./functions.scss";
3
4
 
4
5
  [data-div-type="element"] {
5
6
  &[data-element-type="productPrice"] {
@@ -45,1535 +46,2011 @@
45
46
  font-weight: 700;
46
47
  line-height: 150%; /* 48px */
47
48
  }
48
- .price-text-element {
49
- // background-color: var(--_ctm-dn-bd-cr, var(--_tst-dn-bd-cr));
50
- padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
49
+
50
+ .product-price {
51
51
  display: flex;
52
52
  flex-direction: column;
53
- gap: 10px;
54
- --_sf-cd-gp: calc(var(--_sf-gp) * 0.5);
55
- // row-gap: var(--_sf-gp);
56
53
  width: 100%;
57
- // height: 100%;
58
- border-color: var(--_ctm-mob-dn-br-cr, var(--_ctm-tab-dn-br-cr, var(--_ctm-dn-br-cr)));
59
- border-style: var(--_ctm-mob-dn-br-se, var(--_ctm-tab-dn-br-se, var(--_ctm-dn-br-se)));
60
- border-width: var(--_ctm-mob-dn-br-wh, var(--_ctm-tab-dn-br-wh, var(--_ctm-dn-br-wh)));
61
- border-radius: var(--_ctm-mob-dn-br-rs, var(--_ctm-tab-dn-br-rs, var(--_ctm-dn-br-rs)));
54
+
55
+ border-color: var(
56
+ --_show-border,
57
+ var(--_ctm-mob-dn-pt-pe-br-cr, var(--_ctm-tab-dn-pt-pe-br-cr, var(--_ctm-dn-pt-pe-br-cr)))
58
+ );
59
+ border-style: var(
60
+ --_show-border,
61
+ var(--_ctm-mob-dn-pt-pe-br-se, var(--_ctm-tab-dn-pt-pe-br-se, var(--_ctm-dn-pt-pe-br-se)))
62
+ );
63
+ border-width: var(
64
+ --_show-border,
65
+ var(--_ctm-mob-dn-pt-pe-br-wh, var(--_ctm-tab-dn-pt-pe-br-wh, var(--_ctm-dn-pt-pe-br-wh)))
66
+ );
67
+ border-radius: var(
68
+ --_ctm-mob-dn-pt-pe-br-rs,
69
+ var(--_ctm-tab-dn-pt-pe-br-rs, var(--_ctm-dn-pt-pe-br-rs))
70
+ );
71
+
62
72
  box-shadow: var(
63
73
  --_show-shadow,
64
- var(--_ctm-mob-dn-sw-ae, var(--_ctm-tab-dn-sw-ae, var(--_ctm-dn-sw-ae)))
65
- var(--_ctm-mob-dn-sw-br, var(--_ctm-tab-dn-sw-br, var(--_ctm-dn-sw-br)))
66
- var(--_ctm-mob-dn-sw-sd, var(--_ctm-tab-dn-sw-sd, var(--_ctm-dn-sw-sd)))
67
- var(--_ctm-mob-dn-sw-cr, var(--_ctm-tab-dn-sw-cr, var(--_ctm-dn-sw-cr)))
74
+ var(--_ctm-mob-dn-pt-pe-sw-ae, var(--_ctm-tab-dn-pt-pe-sw-ae, var(--_ctm-dn-pt-pe-sw-ae)))
75
+ var(--_ctm-mob-dn-pt-pe-sw-br, var(--_ctm-tab-dn-pt-pe-sw-br, var(--_ctm-dn-pt-pe-sw-br)))
76
+ var(--_ctm-mob-dn-pt-pe-sw-sd, var(--_ctm-tab-dn-pt-pe-sw-sd, var(--_ctm-dn-pt-pe-sw-sd)))
77
+ var(--_ctm-mob-dn-pt-pe-sw-cr, var(--_ctm-tab-dn-pt-pe-sw-cr, var(--_ctm-dn-pt-pe-sw-cr)))
68
78
  );
79
+ background-color: var(
80
+ --_ctm-mob-dn-pt-pe-bd-cr,
81
+ var(--_ctm-tab-dn-pt-pe-bd-cr, var(--_ctm-dn-pt-pe-bd-cr))
82
+ );
83
+ .price-loader {
84
+ display: inline-block;
85
+ width: var(--_ctm-lt-wh, 100px);
86
+ height: 16px;
87
+ border-radius: 4px;
88
+ background: linear-gradient(90deg, #eee 25%, #f5f5f5 50%, #eee 75%);
89
+ background-size: 200% 100%;
90
+ animation: shimmer 1.4s infinite;
91
+ }
69
92
 
70
- // transform: scale(var(--_ctm-dn-zm-ie));
71
- scale: var(--_ctm-mob-dn-zm-ie, var(--_ctm-tab-dn-zm-ie, var(--_ctm-dn-zm-ie)));
93
+ @keyframes shimmer {
94
+ 0% {
95
+ background-position: -200% 0;
96
+ }
97
+ 100% {
98
+ background-position: 200% 0;
99
+ }
100
+ }
72
101
 
73
- &[data-flip-x="true"] {
74
- transform: scaleX(-1);
102
+ .price-span {
103
+ color: var(--_ctm-mob-dn-pt-pe-cr, var(--_ctm-tab-dn-pt-pe-cr, var(--_ctm-dn-pt-pe-cr)));
104
+ font-family:
105
+ var(
106
+ --_ctm-mob-dn-pt-pe-ft-fy,
107
+ var(--_ctm-tab-dn-pt-pe-ft-fy, var(--_ctm-dn-pt-pe-ft-fy))
108
+ ),
109
+ sans-serif;
110
+ font-size: var(
111
+ --_ctm-mob-dn-pt-pe-ft-se,
112
+ var(--_ctm-tab-dn-pt-pe-ft-se, var(--_ctm-dn-pt-pe-ft-se))
113
+ );
114
+ font-weight: var(
115
+ --_ctm-mob-dn-pt-pe-ft-wt,
116
+ var(--_ctm-tab-dn-pt-pe-ft-wt, var(--_ctm-dn-pt-pe-ft-wt))
117
+ );
118
+ font-style: var(
119
+ --_ctm-mob-dn-pt-pe-ft-se-ic,
120
+ var(--_ctm-tab-dn-pt-pe-ft-se-ic, var(--_ctm-dn-pt-pe-ft-se-ic))
121
+ );
122
+ text-align: var(
123
+ --_ctm-mob-dn-pt-pe-tt-an,
124
+ var(--_ctm-tab-dn-pt-pe-tt-an, var(--_ctm-dn-pt-pe-tt-an))
125
+ );
126
+ letter-spacing: var(
127
+ --_ctm-mob-dn-pt-pe-lr-sg,
128
+ var(--_ctm-tab-dn-pt-pe-lr-sg, var(--_ctm-dn-pt-pe-lr-sg))
129
+ );
130
+ line-height: var(
131
+ --_ctm-mob-dn-pt-pe-le-ht,
132
+ var(--_ctm-tab-dn-pt-pe-le-ht, var(--_ctm-dn-pt-pe-le-ht))
133
+ );
134
+ text-decoration: var(
135
+ --_ctm-mob-dn-pt-pe-ue,
136
+ var(--_ctm-tab-dn-pt-pe-ue, var(--_ctm-dn-pt-pe-ue))
137
+ );
75
138
  }
76
- &[data-flip-y="true"] {
77
- transform: scaleY(-1);
139
+ .strike-price {
140
+ color: var(
141
+ --_ctm-mob-dn-pt-pe-cr-dc,
142
+ var(--_ctm-tab-dn-pt-pe-cr-dc, var(--_ctm-dn-pt-pe-cr-dc))
143
+ );
144
+ font-family: var(
145
+ --_sf-hr-ff,
146
+ var(
147
+ --_ctm-mob-dn-pt-pe-ft-fy-dc,
148
+ var(--_ctm-tab-dn-pt-pe-ft-fy-dc, var(--_ctm-dn-pt-pe-ft-fy-dc))
149
+ )
150
+ );
151
+ font-size: var(
152
+ --_ctm-mob-dn-pt-pe-ft-se-dc,
153
+ var(--_ctm-tab-dn-pt-pe-ft-se-dc, var(--_ctm-dn-pt-pe-ft-se-dc))
154
+ );
155
+ font-weight: var(
156
+ --_ctm-mob-dn-pt-pe-ft-wt-dc,
157
+ var(--_ctm-tab-dn-pt-pe-ft-wt-dc, var(--_ctm-dn-pt-pe-ft-wt-dc))
158
+ );
159
+ font-style: var(
160
+ --_ctm-mob-dn-pt-pe-ft-se-ic-dc,
161
+ var(--_ctm-tab-dn-pt-pe-ft-se-ic-dc, var(--_ctm-dn-pt-pe-ft-se-ic-dc))
162
+ );
163
+ text-align: var(
164
+ --_ctm-mob-dn-pt-pe-tt-an-dc,
165
+ var(--_ctm-tab-dn-pt-pe-tt-an-dc, var(--_ctm-dn-pt-pe-tt-an-dc))
166
+ );
167
+ letter-spacing: var(
168
+ --_ctm-mob-dn-pt-pe-lr-sg-dc,
169
+ var(--_ctm-tab-dn-pt-pe-lr-sg-dc, var(--_ctm-dn-pt-pe-lr-sg-dc))
170
+ );
171
+ line-height: var(
172
+ --_ctm-mob-dn-pt-pe-le-ht-dc,
173
+ var(--_ctm-tab-dn-pt-pe-le-ht-dc, var(--_ctm-dn-pt-pe-le-ht-dc))
174
+ );
175
+ text-decoration: var(
176
+ --_ctm-mob-dn-pt-pe-ue-dc,
177
+ var(--_ctm-tab-dn-pt-pe-ue-dc, var(--_ctm-dn-pt-pe-ue-dc))
178
+ );
78
179
  }
79
- .meta_text_element {
80
- color: green;
81
- //styleName: Text md/Medium;
82
- font-family: Lato;
83
- font-size: 16px;
84
- font-weight: 500;
85
- line-height: 24px;
86
- text-align: left;
87
- text-underline-position: from-font;
88
- text-decoration-skip-ink: none;
180
+
181
+ .code-span {
182
+ background-color: var(
183
+ --_ctm-mob-dn-cy-ce-se-bd-cr,
184
+ var(--_ctm-tab-dn-cy-ce-se-bd-cr, var(--_ctm-dn-cy-ce-se-bd-cr))
185
+ );
186
+ color: var(
187
+ --_ctm-mob-dn-cy-ce-se-cr,
188
+ var(--_ctm-tab-dn-cy-ce-se-cr, var(--_ctm-dn-cy-ce-se-cr))
189
+ );
190
+ font-family:
191
+ var(
192
+ --_ctm-mob-dn-cy-ce-se-ft-fy,
193
+ var(--_ctm-tab-dn-cy-ce-se-ft-fy, var(--_ctm-dn-cy-ce-se-ft-fy))
194
+ ),
195
+ sans-serif;
196
+ font-size: var(
197
+ --_ctm-mob-dn-cy-ce-se-ft-se,
198
+ var(--_ctm-tab-dn-cy-ce-se-ft-se, var(--_ctm-dn-cy-ce-se-ft-se))
199
+ );
200
+ font-weight: var(
201
+ --_ctm-mob-dn-cy-ce-se-ft-wt,
202
+ var(--_ctm-tab-dn-cy-ce-se-ft-wt, var(--_ctm-dn-cy-ce-se-ft-wt))
203
+ );
204
+ font-style: var(
205
+ --_ctm-mob-dn-cy-ce-se-ft-se-ic,
206
+ var(--_ctm-tab-dn-cy-ce-se-ft-se-ic, var(--_ctm-dn-cy-ce-se-ft-se-ic))
207
+ );
208
+ text-align: var(
209
+ --_ctm-mob-dn-cy-ce-se-tt-an,
210
+ var(--_ctm-tab-dn-cy-ce-se-tt-an, var(--_ctm-dn-cy-ce-se-tt-an))
211
+ );
212
+ letter-spacing: var(
213
+ --_ctm-mob-dn-cy-ce-se-lr-sg,
214
+ var(--_ctm-tab-dn-cy-ce-se-lr-sg, var(--_ctm-dn-cy-ce-se-lr-sg))
215
+ );
216
+ line-height: var(
217
+ --_ctm-mob-dn-cy-ce-se-le-ht,
218
+ var(--_ctm-tab-dn-cy-ce-se-le-ht, var(--_ctm-dn-cy-ce-se-le-ht))
219
+ );
220
+ text-decoration: var(
221
+ --_ctm-mob-dn-cy-ce-se-ue,
222
+ var(--_ctm-tab-dn-cy-ce-se-ue, var(--_ctm-dn-cy-ce-se-ue))
223
+ );
224
+
225
+ border-color: var(
226
+ --_show-border,
227
+ var(
228
+ --_ctm-mob-dn-cy-ce-se-br-cr,
229
+ var(--_ctm-tab-dn-cy-ce-se-br-cr, var(--_ctm-dn-cy-ce-se-br-cr))
230
+ )
231
+ );
232
+ border-style: var(
233
+ --_show-border,
234
+ var(
235
+ --_ctm-mob-dn-cy-ce-se-br-se,
236
+ var(--_ctm-tab-dn-cy-ce-se-br-se, var(--_ctm-dn-cy-ce-se-br-se))
237
+ )
238
+ );
239
+ border-width: var(
240
+ --_show-border,
241
+ var(
242
+ --_ctm-mob-dn-cy-ce-se-br-wh,
243
+ var(--_ctm-tab-dn-cy-ce-se-br-wh, var(--_ctm-dn-cy-ce-se-br-wh))
244
+ )
245
+ );
246
+ border-radius: var(
247
+ --_ctm-mob-dn-cy-ce-se-br-rs,
248
+ var(--_ctm-tab-dn-cy-ce-se-br-rs, var(--_ctm-dn-cy-ce-se-br-rs))
249
+ );
250
+
251
+ box-shadow: var(
252
+ --_show-shadow,
253
+ var(
254
+ --_ctm-mob-dn-cy-ce-se-sw-ae,
255
+ var(--_ctm-tab-dn-cy-ce-se-sw-ae, var(--_ctm-dn-cy-ce-se-sw-ae))
256
+ )
257
+ var(
258
+ --_ctm-mob-dn-cy-ce-se-sw-br,
259
+ var(--_ctm-tab-dn-cy-ce-se-sw-br, var(--_ctm-dn-cy-ce-se-sw-br))
260
+ )
261
+ var(
262
+ --_ctm-mob-dn-cy-ce-se-sw-sd,
263
+ var(--_ctm-tab-dn-cy-ce-se-sw-sd, var(--_ctm-dn-cy-ce-se-sw-sd))
264
+ )
265
+ var(
266
+ --_ctm-mob-dn-cy-ce-se-sw-cr,
267
+ var(--_ctm-tab-dn-cy-ce-se-sw-cr, var(--_ctm-dn-cy-ce-se-sw-cr))
268
+ )
269
+ );
89
270
  }
90
- .price-container {
271
+
272
+ .uom-span {
273
+ background-color: var(
274
+ --_ctm-mob-dn-um-se-bd-cr,
275
+ var(--_ctm-tab-dn-um-se-bd-cr, var(--_ctm-dn-um-se-bd-cr))
276
+ );
277
+ color: var(--_ctm-mob-dn-um-se-cr, var(--_ctm-tab-dn-um-se-cr, var(--_ctm-dn-um-se-cr)));
278
+ font-family:
279
+ var(
280
+ --_ctm-mob-dn-um-se-ft-fy,
281
+ var(--_ctm-tab-dn-um-se-ft-fy, var(--_ctm-dn-um-se-ft-fy))
282
+ ),
283
+ sans-serif;
284
+ font-size: var(
285
+ --_ctm-mob-dn-um-se-ft-se,
286
+ var(--_ctm-tab-dn-um-se-ft-se, var(--_ctm-dn-um-se-ft-se))
287
+ );
288
+ font-weight: var(
289
+ --_ctm-mob-dn-um-se-ft-wt,
290
+ var(--_ctm-tab-dn-um-se-ft-wt, var(--_ctm-dn-um-se-ft-wt))
291
+ );
292
+ font-style: var(
293
+ --_ctm-mob-dn-um-se-ft-se-ic,
294
+ var(--_ctm-tab-dn-um-se-ft-se-ic, var(--_ctm-dn-um-se-ft-se-ic))
295
+ );
296
+ text-align: var(
297
+ --_ctm-mob-dn-um-se-tt-an,
298
+ var(--_ctm-tab-dn-um-se-tt-an, var(--_ctm-dn-um-se-tt-an))
299
+ );
300
+ letter-spacing: var(
301
+ --_ctm-mob-dn-um-se-lr-sg,
302
+ var(--_ctm-tab-dn-um-se-lr-sg, var(--_ctm-dn-um-se-lr-sg))
303
+ );
304
+ line-height: var(
305
+ --_ctm-mob-dn-um-se-le-ht,
306
+ var(--_ctm-tab-dn-um-se-le-ht, var(--_ctm-dn-um-se-le-ht))
307
+ );
308
+ text-decoration: var(
309
+ --_ctm-mob-dn-um-se-ue,
310
+ var(--_ctm-tab-dn-um-se-ue, var(--_ctm-dn-um-se-ue))
311
+ );
312
+
313
+ border-color: var(
314
+ --_show-border,
315
+ var(--_ctm-mob-dn-um-se-br-cr, var(--_ctm-tab-dn-um-se-br-cr, var(--_ctm-dn-um-se-br-cr)))
316
+ );
317
+ border-style: var(
318
+ --_show-border,
319
+ var(--_ctm-mob-dn-um-se-br-se, var(--_ctm-tab-dn-um-se-br-se, var(--_ctm-dn-um-se-br-se)))
320
+ );
321
+ border-width: var(
322
+ --_show-border,
323
+ var(--_ctm-mob-dn-um-se-br-wh, var(--_ctm-tab-dn-um-se-br-wh, var(--_ctm-dn-um-se-br-wh)))
324
+ );
325
+ border-radius: var(
326
+ --_ctm-mob-dn-um-se-br-rs,
327
+ var(--_ctm-tab-dn-um-se-br-rs, var(--_ctm-dn-um-se-br-rs))
328
+ );
329
+
330
+ box-shadow: var(
331
+ --_show-shadow,
332
+ var(--_ctm-mob-dn-um-se-sw-ae, var(--_ctm-tab-dn-um-se-sw-ae, var(--_ctm-dn-um-se-sw-ae)))
333
+ var(
334
+ --_ctm-mob-dn-um-se-sw-br,
335
+ var(--_ctm-tab-dn-um-se-sw-br, var(--_ctm-dn-um-se-sw-br))
336
+ )
337
+ var(
338
+ --_ctm-mob-dn-um-se-sw-sd,
339
+ var(--_ctm-tab-dn-um-se-sw-sd, var(--_ctm-dn-um-se-sw-sd))
340
+ )
341
+ var(
342
+ --_ctm-mob-dn-um-se-sw-cr,
343
+ var(--_ctm-tab-dn-um-se-sw-cr, var(--_ctm-dn-um-se-sw-cr))
344
+ )
345
+ );
346
+ }
347
+ .denominations_container {
348
+ // font-size: 16px;
91
349
  display: flex;
92
- align-items: center;
93
- gap: 5px;
94
- .element-container {
350
+ flex-direction: column;
351
+ // gap: 6px;
352
+ // padding-bottom: 14px;
353
+
354
+ background-color: var(
355
+ --_ctm-mob-dn-gt-cd-cd-wr-bd-cr,
356
+ var(--_ctm-tab-dn-gt-cd-cd-wr-bd-cr, var(--_ctm-dn-gt-cd-cd-wr-bd-cr))
357
+ );
358
+ border-color: var(
359
+ --_ctm-mob-dn-gt-cd-cd-wr-br-cr,
360
+ var(--_ctm-tab-dn-gt-cd-cd-wr-br-cr, var(--_ctm-dn-gt-cd-cd-wr-br-cr))
361
+ );
362
+ border-radius: var(
363
+ --_ctm-mob-dn-gt-cd-cd-wr-br-rs,
364
+ var(--_ctm-tab-dn-gt-cd-cd-wr-br-rs, var(--_ctm-dn-gt-cd-cd-wr-br-rs))
365
+ );
366
+ border-style: var(
367
+ --_ctm-mob-dn-gt-cd-cd-wr-br-se,
368
+ var(--_ctm-tab-dn-gt-cd-cd-wr-br-se, var(--_ctm-dn-gt-cd-cd-wr-br-se))
369
+ );
370
+ border-width: var(
371
+ --_ctm-mob-dn-gt-cd-cd-wr-br-wh,
372
+ var(--_ctm-tab-dn-gt-cd-cd-wr-br-wh, var(--_ctm-dn-gt-cd-cd-wr-br-wh))
373
+ );
374
+ box-shadow: var(
375
+ --_ctm-mob-dn-gt-cd-cd-wr-sw-ae,
376
+ var(--_ctm-tab-dn-gt-cd-cd-wr-sw-ae, var(--_ctm-dn-gt-cd-cd-wr-sw-ae))
377
+ )
378
+ var(
379
+ --_ctm-mob-dn-gt-cd-cd-wr-sw-br,
380
+ var(--_ctm-tab-dn-gt-cd-cd-wr-sw-br, var(--_ctm-dn-gt-cd-cd-wr-sw-br))
381
+ )
382
+ var(
383
+ --_ctm-mob-dn-gt-cd-cd-wr-sw-sd,
384
+ var(--_ctm-tab-dn-gt-cd-cd-wr-sw-sd, var(--_ctm-dn-gt-cd-cd-wr-sw-sd))
385
+ )
386
+ var(
387
+ --_ctm-mob-dn-gt-cd-cd-wr-sw-cr,
388
+ var(--_ctm-tab-dn-gt-cd-cd-wr-sw-cr, var(--_ctm-dn-gt-cd-cd-wr-sw-cr))
389
+ );
390
+ padding: var(
391
+ --_ctm-mob-dn-gt-cd-cd-wr-pg,
392
+ var(--_ctm-tab-dn-gt-cd-cd-wr-pg, var(--_ctm-dn-gt-cd-cd-wr-pg))
393
+ );
394
+ gap: var(
395
+ --_ctm-mob-dn-gt-cd-cd-wr-im-gp,
396
+ var(--_ctm-tab-dn-gt-cd-cd-wr-im-gp, var(--_ctm-dn-gt-cd-cd-wr-im-gp))
397
+ );
398
+ .denominations_title {
399
+ // margin-bottom: 4px;
400
+ // font-size: 16px;
401
+ // color: #000000;
402
+ // font-weight: 500;
403
+ // line-height: 150%;
404
+ font-family: var(
405
+ --_ctm-mob-dn-gt-cd-ts-ft-fy,
406
+ var(--_ctm-tab-dn-gt-cd-ts-ft-fy, var(--_ctm-dn-gt-cd-ts-ft-fy))
407
+ );
408
+ color: var(
409
+ --_ctm-mob-dn-gt-cd-ts-cr,
410
+ var(--_ctm-tab-dn-gt-cd-ts-cr, var(--_ctm-dn-gt-cd-ts-cr))
411
+ );
412
+ font-weight: var(
413
+ --_ctm-mob-dn-gt-cd-ts-ft-wt,
414
+ var(--_ctm-tab-dn-gt-cd-ts-ft-wt, var(--_ctm-dn-gt-cd-ts-ft-wt))
415
+ );
416
+ font-size: var(
417
+ --_ctm-mob-dn-gt-cd-ts-ft-se,
418
+ var(--_ctm-tab-dn-gt-cd-ts-ft-se, var(--_ctm-dn-gt-cd-ts-ft-se))
419
+ );
420
+ text-decoration: var(
421
+ --_ctm-mob-dn-gt-cd-ts-ue,
422
+ var(--_ctm-tab-dn-gt-cd-ts-ue, var(--_ctm-dn-gt-cd-ts-ue))
423
+ );
424
+ letter-spacing: var(
425
+ --_ctm-mob-dn-gt-cd-ts-lr-sg,
426
+ var(--_ctm-tab-dn-gt-cd-ts-lr-sg, var(--_ctm-dn-gt-cd-ts-lr-sg))
427
+ );
428
+ line-height: var(
429
+ --_ctm-mob-dn-gt-cd-ts-le-ht,
430
+ var(--_ctm-tab-dn-gt-cd-ts-le-ht, var(--_ctm-dn-gt-cd-ts-le-ht))
431
+ );
432
+ font-style: var(
433
+ --_ctm-mob-dn-gt-cd-ts-ft-se-ic,
434
+ var(--_ctm-tab-dn-gt-cd-ts-ft-se-ic, var(--_ctm-dn-gt-cd-ts-ft-se-ic))
435
+ );
436
+ text-align: var(
437
+ --_ctm-mob-dn-gt-cd-ts-tt-an,
438
+ var(--_ctm-tab-dn-gt-cd-ts-tt-an, var(--_ctm-dn-gt-cd-ts-tt-an))
439
+ );
440
+ }
441
+ .denominations_grid {
95
442
  display: flex;
96
- align-items: flex-start;
97
- gap: 10px;
98
- flex-direction: column;
99
- .product-price {
443
+ // gap: 8px;
444
+ flex-wrap: wrap;
445
+ margin-top: 12px;
446
+ flex-direction: row;
447
+ gap: 12px;
448
+ // gap: var(
449
+ // --_ctm-mob-dn-gt-cd-cd-dt-se-im-gp,
450
+ // var(--_ctm-tab-dn-gt-cd-cd-dt-se-im-gp, var(--_ctm-dn-gt-cd-cd-dt-se-im-gp))
451
+ // );
452
+ .amount_btn {
453
+ transition: color 0.3s ease;
454
+ cursor: pointer;
100
455
  display: flex;
101
- flex-direction: column;
456
+ align-items: center;
457
+ justify-content: center;
458
+ // padding: 4px;
459
+ min-width: 20px;
460
+ min-height: 20px;
461
+ box-sizing: content-box;
462
+ // font-size: 16px;
463
+ // font-weight: 600;
464
+ // line-height: 150%;
465
+ // background-color: #ffffff;
466
+ // border: 1px solid #d6d6d6;
467
+ background-color: var(
468
+ --_ctm-mob-dn-gt-cd-cd-dt-se-bd-cr,
469
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-bd-cr, var(--_ctm-dn-gt-cd-cd-dt-se-bd-cr))
470
+ );
471
+ font-family: var(
472
+ --_ctm-mob-dn-gt-cd-cd-dt-se-ft-fy,
473
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-ft-fy, var(--_ctm-dn-gt-cd-cd-dt-se-ft-fy))
474
+ );
475
+ color: var(
476
+ --_ctm-mob-dn-gt-cd-cd-dt-se-cr,
477
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-cr, var(--_ctm-dn-gt-cd-cd-dt-se-cr))
478
+ );
479
+ font-weight: var(
480
+ --_ctm-mob-dn-gt-cd-cd-dt-se-ft-wt,
481
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-ft-wt, var(--_ctm-dn-gt-cd-cd-dt-se-ft-wt))
482
+ );
483
+ font-size: var(
484
+ --_ctm-mob-dn-gt-cd-cd-dt-se-ft-se,
485
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-ft-se, var(--_ctm-dn-gt-cd-cd-dt-se-ft-se))
486
+ );
487
+ text-decoration: var(
488
+ --_ctm-mob-dn-gt-cd-cd-dt-se-ue,
489
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-ue, var(--_ctm-dn-gt-cd-cd-dt-se-ue))
490
+ );
491
+ letter-spacing: var(
492
+ --_ctm-mob-dn-gt-cd-cd-dt-se-lr-sg,
493
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-lr-sg, var(--_ctm-dn-gt-cd-cd-dt-se-lr-sg))
494
+ );
495
+ line-height: var(
496
+ --_ctm-mob-dn-gt-cd-cd-dt-se-le-ht,
497
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-le-ht, var(--_ctm-dn-gt-cd-cd-dt-se-le-ht))
498
+ );
499
+ font-style: var(
500
+ --_ctm-mob-dn-gt-cd-cd-dt-se-ft-se-ic,
501
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-ft-se-ic, var(--_ctm-dn-gt-cd-cd-dt-se-ft-se-ic))
502
+ );
503
+ text-align: var(
504
+ --_ctm-mob-dn-gt-cd-cd-dt-se-tt-an,
505
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-tt-an, var(--_ctm-dn-gt-cd-cd-dt-se-tt-an))
506
+ );
102
507
  border-color: var(
103
- --_show-border,
104
- var(
105
- --_ctm-mob-dn-pt-pe-br-cr,
106
- var(--_ctm-tab-dn-pt-pe-br-cr, var(--_ctm-dn-pt-pe-br-cr))
107
- )
508
+ --_ctm-mob-dn-gt-cd-cd-dt-se-br-cr,
509
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-br-cr, var(--_ctm-dn-gt-cd-cd-dt-se-br-cr))
510
+ );
511
+ border-radius: var(
512
+ --_ctm-mob-dn-gt-cd-cd-dt-se-br-rs,
513
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-br-rs, var(--_ctm-dn-gt-cd-cd-dt-se-br-rs))
108
514
  );
109
515
  border-style: var(
110
- --_show-border,
111
- var(
112
- --_ctm-mob-dn-pt-pe-br-se,
113
- var(--_ctm-tab-dn-pt-pe-br-se, var(--_ctm-dn-pt-pe-br-se))
114
- )
516
+ --_ctm-mob-dn-gt-cd-cd-dt-se-br-se,
517
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-br-se, var(--_ctm-dn-gt-cd-cd-dt-se-br-se))
115
518
  );
116
519
  border-width: var(
117
- --_show-border,
118
- var(
119
- --_ctm-mob-dn-pt-pe-br-wh,
120
- var(--_ctm-tab-dn-pt-pe-br-wh, var(--_ctm-dn-pt-pe-br-wh))
121
- )
122
- );
123
- border-radius: var(
124
- --_ctm-mob-dn-pt-pe-br-rs,
125
- var(--_ctm-tab-dn-pt-pe-br-rs, var(--_ctm-dn-pt-pe-br-rs))
520
+ --_ctm-mob-dn-gt-cd-cd-dt-se-br-wh,
521
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-br-wh, var(--_ctm-dn-gt-cd-cd-dt-se-br-wh))
126
522
  );
127
-
128
523
  box-shadow: var(
129
- --_show-shadow,
524
+ --_ctm-mob-dn-gt-cd-cd-dt-se-sw-ae,
525
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-sw-ae, var(--_ctm-dn-gt-cd-cd-dt-se-sw-ae))
526
+ )
130
527
  var(
131
- --_ctm-mob-dn-pt-pe-sw-ae,
132
- var(--_ctm-tab-dn-pt-pe-sw-ae, var(--_ctm-dn-pt-pe-sw-ae))
133
- )
134
- var(
135
- --_ctm-mob-dn-pt-pe-sw-br,
136
- var(--_ctm-tab-dn-pt-pe-sw-br, var(--_ctm-dn-pt-pe-sw-br))
137
- )
138
- var(
139
- --_ctm-mob-dn-pt-pe-sw-sd,
140
- var(--_ctm-tab-dn-pt-pe-sw-sd, var(--_ctm-dn-pt-pe-sw-sd))
141
- )
142
- var(
143
- --_ctm-mob-dn-pt-pe-sw-cr,
144
- var(--_ctm-tab-dn-pt-pe-sw-cr, var(--_ctm-dn-pt-pe-sw-cr))
145
- )
146
- );
147
- background-color: var(
148
- --_ctm-mob-dn-pt-pe-bd-cr,
149
- var(--_ctm-tab-dn-pt-pe-bd-cr, var(--_ctm-dn-pt-pe-bd-cr))
528
+ --_ctm-mob-dn-gt-cd-cd-dt-se-sw-br,
529
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-sw-br, var(--_ctm-dn-gt-cd-cd-dt-se-sw-br))
530
+ )
531
+ var(
532
+ --_ctm-mob-dn-gt-cd-cd-dt-se-sw-sd,
533
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-sw-sd, var(--_ctm-dn-gt-cd-cd-dt-se-sw-sd))
534
+ )
535
+ var(
536
+ --_ctm-mob-dn-gt-cd-cd-dt-se-sw-cr,
537
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-sw-cr, var(--_ctm-dn-gt-cd-cd-dt-se-sw-cr))
538
+ );
539
+ padding: var(
540
+ --_ctm-mob-dn-gt-cd-cd-dt-se-pg,
541
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-pg, var(--_ctm-dn-gt-cd-cd-dt-se-pg))
150
542
  );
151
- .price-loader {
152
- display: inline-block;
153
- width: var(--_ctm-lt-wh, 100px);
154
- height: 16px;
155
- border-radius: 4px;
156
- background: linear-gradient(90deg, #eee 25%, #f5f5f5 50%, #eee 75%);
157
- background-size: 200% 100%;
158
- animation: shimmer 1.4s infinite;
159
- }
160
-
161
- @keyframes shimmer {
162
- 0% {
163
- background-position: -200% 0;
164
- }
165
- 100% {
166
- background-position: 200% 0;
167
- }
168
- }
169
-
170
- .price-span {
171
- color: var(
172
- --_ctm-mob-dn-pt-pe-cr,
173
- var(--_ctm-tab-dn-pt-pe-cr, var(--_ctm-dn-pt-pe-cr))
543
+ &.active {
544
+ background-color: var(
545
+ --_ctm-mob-dn-gt-cd-cd-sd-se-bd-cr,
546
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-bd-cr, var(--_ctm-dn-gt-cd-cd-sd-se-bd-cr))
174
547
  );
175
548
  font-family: var(
176
- --_ctm-mob-dn-pt-pe-ft-fy,
177
- var(--_ctm-tab-dn-pt-pe-ft-fy, var(--_ctm-dn-pt-pe-ft-fy))
178
- ),
179
- sans-serif;
180
- font-size: var(
181
- --_ctm-mob-dn-pt-pe-ft-se,
182
- var(--_ctm-tab-dn-pt-pe-ft-se, var(--_ctm-dn-pt-pe-ft-se))
183
- );
184
- font-weight: var(
185
- --_ctm-mob-dn-pt-pe-ft-wt,
186
- var(--_ctm-tab-dn-pt-pe-ft-wt, var(--_ctm-dn-pt-pe-ft-wt))
187
- );
188
- font-style: var(
189
- --_ctm-mob-dn-pt-pe-ft-se-ic,
190
- var(--_ctm-tab-dn-pt-pe-ft-se-ic, var(--_ctm-dn-pt-pe-ft-se-ic))
191
- );
192
- text-align: var(
193
- --_ctm-mob-dn-pt-pe-tt-an,
194
- var(--_ctm-tab-dn-pt-pe-tt-an, var(--_ctm-dn-pt-pe-tt-an))
195
- );
196
- letter-spacing: var(
197
- --_ctm-mob-dn-pt-pe-lr-sg,
198
- var(--_ctm-tab-dn-pt-pe-lr-sg, var(--_ctm-dn-pt-pe-lr-sg))
549
+ --_ctm-mob-dn-gt-cd-cd-sd-se-ft-fy,
550
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-ft-fy, var(--_ctm-dn-gt-cd-cd-sd-se-ft-fy))
199
551
  );
200
- line-height: var(
201
- --_ctm-mob-dn-pt-pe-le-ht,
202
- var(--_ctm-tab-dn-pt-pe-le-ht, var(--_ctm-dn-pt-pe-le-ht))
203
- );
204
- text-decoration: var(
205
- --_ctm-mob-dn-pt-pe-ue,
206
- var(--_ctm-tab-dn-pt-pe-ue, var(--_ctm-dn-pt-pe-ue))
207
- );
208
- }
209
- .strike-price {
210
552
  color: var(
211
- --_ctm-mob-dn-pt-pe-cr-dc,
212
- var(--_ctm-tab-dn-pt-pe-cr-dc, var(--_ctm-dn-pt-pe-cr-dc))
213
- );
214
- font-family: var(
215
- --_sf-hr-ff,
216
- var(
217
- --_ctm-mob-dn-pt-pe-ft-fy-dc,
218
- var(--_ctm-tab-dn-pt-pe-ft-fy-dc, var(--_ctm-dn-pt-pe-ft-fy-dc))
219
- )
220
- );
221
- font-size: var(
222
- --_ctm-mob-dn-pt-pe-ft-se-dc,
223
- var(--_ctm-tab-dn-pt-pe-ft-se-dc, var(--_ctm-dn-pt-pe-ft-se-dc))
553
+ --_ctm-mob-dn-gt-cd-cd-sd-se-cr,
554
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-cr, var(--_ctm-dn-gt-cd-cd-sd-se-cr))
224
555
  );
225
556
  font-weight: var(
226
- --_ctm-mob-dn-pt-pe-ft-wt-dc,
227
- var(--_ctm-tab-dn-pt-pe-ft-wt-dc, var(--_ctm-dn-pt-pe-ft-wt-dc))
557
+ --_ctm-mob-dn-gt-cd-cd-sd-se-ft-wt,
558
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-ft-wt, var(--_ctm-dn-gt-cd-cd-sd-se-ft-wt))
228
559
  );
229
- font-style: var(
230
- --_ctm-mob-dn-pt-pe-ft-se-ic-dc,
231
- var(--_ctm-tab-dn-pt-pe-ft-se-ic-dc, var(--_ctm-dn-pt-pe-ft-se-ic-dc))
560
+ font-size: var(
561
+ --_ctm-mob-dn-gt-cd-cd-sd-se-ft-se,
562
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-ft-se, var(--_ctm-dn-gt-cd-cd-sd-se-ft-se))
232
563
  );
233
- text-align: var(
234
- --_ctm-mob-dn-pt-pe-tt-an-dc,
235
- var(--_ctm-tab-dn-pt-pe-tt-an-dc, var(--_ctm-dn-pt-pe-tt-an-dc))
564
+ text-decoration: var(
565
+ --_ctm-mob-dn-gt-cd-cd-sd-se-ue,
566
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-ue, var(--_ctm-dn-gt-cd-cd-sd-se-ue))
236
567
  );
237
568
  letter-spacing: var(
238
- --_ctm-mob-dn-pt-pe-lr-sg-dc,
239
- var(--_ctm-tab-dn-pt-pe-lr-sg-dc, var(--_ctm-dn-pt-pe-lr-sg-dc))
569
+ --_ctm-mob-dn-gt-cd-cd-sd-se-lr-sg,
570
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-lr-sg, var(--_ctm-dn-gt-cd-cd-sd-se-lr-sg))
240
571
  );
241
572
  line-height: var(
242
- --_ctm-mob-dn-pt-pe-le-ht-dc,
243
- var(--_ctm-tab-dn-pt-pe-le-ht-dc, var(--_ctm-dn-pt-pe-le-ht-dc))
244
- );
245
- text-decoration: var(
246
- --_ctm-mob-dn-pt-pe-ue-dc,
247
- var(--_ctm-tab-dn-pt-pe-ue-dc, var(--_ctm-dn-pt-pe-ue-dc))
248
- );
249
- }
250
-
251
- .code-span {
252
- background-color: var(
253
- --_ctm-mob-dn-cy-ce-se-bd-cr,
254
- var(--_ctm-tab-dn-cy-ce-se-bd-cr, var(--_ctm-dn-cy-ce-se-bd-cr))
255
- );
256
- color: var(
257
- --_ctm-mob-dn-cy-ce-se-cr,
258
- var(--_ctm-tab-dn-cy-ce-se-cr, var(--_ctm-dn-cy-ce-se-cr))
259
- );
260
- font-family: var(
261
- --_ctm-mob-dn-cy-ce-se-ft-fy,
262
- var(--_ctm-tab-dn-cy-ce-se-ft-fy, var(--_ctm-dn-cy-ce-se-ft-fy))
263
- ),
264
- sans-serif;
265
- font-size: var(
266
- --_ctm-mob-dn-cy-ce-se-ft-se,
267
- var(--_ctm-tab-dn-cy-ce-se-ft-se, var(--_ctm-dn-cy-ce-se-ft-se))
268
- );
269
- font-weight: var(
270
- --_ctm-mob-dn-cy-ce-se-ft-wt,
271
- var(--_ctm-tab-dn-cy-ce-se-ft-wt, var(--_ctm-dn-cy-ce-se-ft-wt))
573
+ --_ctm-mob-dn-gt-cd-cd-sd-se-le-ht,
574
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-le-ht, var(--_ctm-dn-gt-cd-cd-sd-se-le-ht))
272
575
  );
273
576
  font-style: var(
274
- --_ctm-mob-dn-cy-ce-se-ft-se-ic,
275
- var(--_ctm-tab-dn-cy-ce-se-ft-se-ic, var(--_ctm-dn-cy-ce-se-ft-se-ic))
577
+ --_ctm-mob-dn-gt-cd-cd-sd-se-ft-se-ic,
578
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-ft-se-ic, var(--_ctm-dn-gt-cd-cd-sd-se-ft-se-ic))
276
579
  );
277
580
  text-align: var(
278
- --_ctm-mob-dn-cy-ce-se-tt-an,
279
- var(--_ctm-tab-dn-cy-ce-se-tt-an, var(--_ctm-dn-cy-ce-se-tt-an))
280
- );
281
- letter-spacing: var(
282
- --_ctm-mob-dn-cy-ce-se-lr-sg,
283
- var(--_ctm-tab-dn-cy-ce-se-lr-sg, var(--_ctm-dn-cy-ce-se-lr-sg))
581
+ --_ctm-mob-dn-gt-cd-cd-sd-se-tt-an,
582
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-tt-an, var(--_ctm-dn-gt-cd-cd-sd-se-tt-an))
284
583
  );
285
- line-height: var(
286
- --_ctm-mob-dn-cy-ce-se-le-ht,
287
- var(--_ctm-tab-dn-cy-ce-se-le-ht, var(--_ctm-dn-cy-ce-se-le-ht))
288
- );
289
- text-decoration: var(
290
- --_ctm-mob-dn-cy-ce-se-ue,
291
- var(--_ctm-tab-dn-cy-ce-se-ue, var(--_ctm-dn-cy-ce-se-ue))
292
- );
293
-
294
584
  border-color: var(
295
- --_show-border,
296
- var(
297
- --_ctm-mob-dn-cy-ce-se-br-cr,
298
- var(--_ctm-tab-dn-cy-ce-se-br-cr, var(--_ctm-dn-cy-ce-se-br-cr))
299
- )
585
+ --_ctm-mob-dn-gt-cd-cd-sd-se-br-cr,
586
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-br-cr, var(--_ctm-dn-gt-cd-cd-sd-se-br-cr))
587
+ );
588
+ border-radius: var(
589
+ --_ctm-mob-dn-gt-cd-cd-sd-se-br-rs,
590
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-br-rs, var(--_ctm-dn-gt-cd-cd-sd-se-br-rs))
300
591
  );
301
592
  border-style: var(
302
- --_show-border,
303
- var(
304
- --_ctm-mob-dn-cy-ce-se-br-se,
305
- var(--_ctm-tab-dn-cy-ce-se-br-se, var(--_ctm-dn-cy-ce-se-br-se))
306
- )
593
+ --_ctm-mob-dn-gt-cd-cd-sd-se-br-se,
594
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-br-se, var(--_ctm-dn-gt-cd-cd-sd-se-br-se))
307
595
  );
308
596
  border-width: var(
309
- --_show-border,
310
- var(
311
- --_ctm-mob-dn-cy-ce-se-br-wh,
312
- var(--_ctm-tab-dn-cy-ce-se-br-wh, var(--_ctm-dn-cy-ce-se-br-wh))
313
- )
597
+ --_ctm-mob-dn-gt-cd-cd-sd-se-br-wh,
598
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-br-wh, var(--_ctm-dn-gt-cd-cd-sd-se-br-wh))
314
599
  );
315
- border-radius: var(
316
- --_ctm-mob-dn-cy-ce-se-br-rs,
317
- var(--_ctm-tab-dn-cy-ce-se-br-rs, var(--_ctm-dn-cy-ce-se-br-rs))
318
- );
319
-
320
600
  box-shadow: var(
321
- --_show-shadow,
322
- var(
323
- --_ctm-mob-dn-cy-ce-se-sw-ae,
324
- var(--_ctm-tab-dn-cy-ce-se-sw-ae, var(--_ctm-dn-cy-ce-se-sw-ae))
325
- )
326
- var(
327
- --_ctm-mob-dn-cy-ce-se-sw-br,
328
- var(--_ctm-tab-dn-cy-ce-se-sw-br, var(--_ctm-dn-cy-ce-se-sw-br))
329
- )
330
- var(
331
- --_ctm-mob-dn-cy-ce-se-sw-sd,
332
- var(--_ctm-tab-dn-cy-ce-se-sw-sd, var(--_ctm-dn-cy-ce-se-sw-sd))
333
- )
334
- var(
335
- --_ctm-mob-dn-cy-ce-se-sw-cr,
336
- var(--_ctm-tab-dn-cy-ce-se-sw-cr, var(--_ctm-dn-cy-ce-se-sw-cr))
337
- )
338
- );
339
- }
340
-
341
- .uom-span {
342
- background-color: var(
343
- --_ctm-mob-dn-um-se-bd-cr,
344
- var(--_ctm-tab-dn-um-se-bd-cr, var(--_ctm-dn-um-se-bd-cr))
345
- );
346
- color: var(
347
- --_ctm-mob-dn-um-se-cr,
348
- var(--_ctm-tab-dn-um-se-cr, var(--_ctm-dn-um-se-cr))
349
- );
350
- font-family: var(
351
- --_ctm-mob-dn-um-se-ft-fy,
352
- var(--_ctm-tab-dn-um-se-ft-fy, var(--_ctm-dn-um-se-ft-fy))
353
- ),
354
- sans-serif;
355
- font-size: var(
356
- --_ctm-mob-dn-um-se-ft-se,
357
- var(--_ctm-tab-dn-um-se-ft-se, var(--_ctm-dn-um-se-ft-se))
358
- );
359
- font-weight: var(
360
- --_ctm-mob-dn-um-se-ft-wt,
361
- var(--_ctm-tab-dn-um-se-ft-wt, var(--_ctm-dn-um-se-ft-wt))
362
- );
363
- font-style: var(
364
- --_ctm-mob-dn-um-se-ft-se-ic,
365
- var(--_ctm-tab-dn-um-se-ft-se-ic, var(--_ctm-dn-um-se-ft-se-ic))
366
- );
367
- text-align: var(
368
- --_ctm-mob-dn-um-se-tt-an,
369
- var(--_ctm-tab-dn-um-se-tt-an, var(--_ctm-dn-um-se-tt-an))
370
- );
371
- letter-spacing: var(
372
- --_ctm-mob-dn-um-se-lr-sg,
373
- var(--_ctm-tab-dn-um-se-lr-sg, var(--_ctm-dn-um-se-lr-sg))
374
- );
375
- line-height: var(
376
- --_ctm-mob-dn-um-se-le-ht,
377
- var(--_ctm-tab-dn-um-se-le-ht, var(--_ctm-dn-um-se-le-ht))
378
- );
379
- text-decoration: var(
380
- --_ctm-mob-dn-um-se-ue,
381
- var(--_ctm-tab-dn-um-se-ue, var(--_ctm-dn-um-se-ue))
382
- );
383
-
384
- border-color: var(
385
- --_show-border,
386
- var(
387
- --_ctm-mob-dn-um-se-br-cr,
388
- var(--_ctm-tab-dn-um-se-br-cr, var(--_ctm-dn-um-se-br-cr))
601
+ --_ctm-mob-dn-gt-cd-cd-sd-se-sw-ae,
602
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-sw-ae, var(--_ctm-dn-gt-cd-cd-sd-se-sw-ae))
389
603
  )
390
- );
391
- border-style: var(
392
- --_show-border,
393
604
  var(
394
- --_ctm-mob-dn-um-se-br-se,
395
- var(--_ctm-tab-dn-um-se-br-se, var(--_ctm-dn-um-se-br-se))
605
+ --_ctm-mob-dn-gt-cd-cd-sd-se-sw-br,
606
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-sw-br, var(--_ctm-dn-gt-cd-cd-sd-se-sw-br))
396
607
  )
397
- );
398
- border-width: var(
399
- --_show-border,
400
608
  var(
401
- --_ctm-mob-dn-um-se-br-wh,
402
- var(--_ctm-tab-dn-um-se-br-wh, var(--_ctm-dn-um-se-br-wh))
609
+ --_ctm-mob-dn-gt-cd-cd-sd-se-sw-sd,
610
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-sw-sd, var(--_ctm-dn-gt-cd-cd-sd-se-sw-sd))
403
611
  )
404
- );
405
- border-radius: var(
406
- --_ctm-mob-dn-um-se-br-rs,
407
- var(--_ctm-tab-dn-um-se-br-rs, var(--_ctm-dn-um-se-br-rs))
408
- );
409
-
410
- box-shadow: var(
411
- --_show-shadow,
412
612
  var(
413
- --_ctm-mob-dn-um-se-sw-ae,
414
- var(--_ctm-tab-dn-um-se-sw-ae, var(--_ctm-dn-um-se-sw-ae))
415
- )
416
- var(
417
- --_ctm-mob-dn-um-se-sw-br,
418
- var(--_ctm-tab-dn-um-se-sw-br, var(--_ctm-dn-um-se-sw-br))
419
- )
420
- var(
421
- --_ctm-mob-dn-um-se-sw-sd,
422
- var(--_ctm-tab-dn-um-se-sw-sd, var(--_ctm-dn-um-se-sw-sd))
423
- )
424
- var(
425
- --_ctm-mob-dn-um-se-sw-cr,
426
- var(--_ctm-tab-dn-um-se-sw-cr, var(--_ctm-dn-um-se-sw-cr))
427
- )
613
+ --_ctm-mob-dn-gt-cd-cd-sd-se-sw-cr,
614
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-sw-cr, var(--_ctm-dn-gt-cd-cd-sd-se-sw-cr))
615
+ );
616
+ padding: var(
617
+ --_ctm-mob-dn-gt-cd-cd-sd-se-pg,
618
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-pg, var(--_ctm-dn-gt-cd-cd-sd-se-pg))
428
619
  );
429
- }
430
- .denominations_container {
431
- font-size: 16px;
432
- display: flex;
433
- flex-direction: column;
434
- gap: 6px;
435
- padding-bottom: 14px;
436
- .denominations_title {
437
- margin-bottom: 4px;
438
- font-size: 16px;
439
- color: #000000;
440
- font-weight: 500;
441
- line-height: 150%;
442
- }
443
- .denominations_grid {
444
- display: flex;
445
- gap: 8px;
446
- flex-wrap: wrap;
447
- margin-bottom: 10px;
448
- flex-direction: row;
449
- gap: 12px;
450
- .amount_btn {
451
- transition: color 0.3s ease;
452
- cursor: pointer;
453
- display: flex;
454
- align-items: center;
455
- justify-content: center;
456
- padding: 4px;
457
- min-width: 20px;
458
- min-height: 20px;
459
- box-sizing: content-box;
460
- font-size: 16px;
461
- font-weight: 600;
462
- line-height: 150%;
463
- background-color: #ffffff;
464
- border: 1px solid #d6d6d6;
465
-
466
- &.active {
467
- background-color: #f5f5f5;
468
- border: 1px solid #3e4784;
469
- color: #000080;
470
- }
471
- }
472
- }
473
- .custom_amount_input {
474
- height: 40px;
475
- display: flex;
476
- position: relative;
477
- gap: 6px;
478
- align-items: center;
479
- border-radius: 4px;
480
- background: #fff;
481
- border: 1px solid #d0d5dd;
482
- padding: 8px 12px;
483
- width: 220px;
484
- transition:
485
- background-color 0.2s,
486
- color 0.2s,
487
- border-color 0.2s,
488
- box-shadow 0.2s;
489
- .svg_icon {
490
- color: var(--_gray-500);
491
- font-weight: 500;
492
- font-size: 14px;
493
- line-height: 24px;
494
- margin-top: 2px;
495
- }
496
- input {
497
- &::placeholder {
498
- color: var(--_gray-500);
499
- font-weight: 500;
500
- font-size: 14px;
501
- line-height: 24px;
502
- }
503
- }
504
- &:focus-within {
505
- outline: 0 none;
506
- outline-offset: 0;
507
- border-radius: 4px;
508
- box-shadow:
509
- 0px 1px 2px rgba(16, 24, 40, 0.05),
510
- 0px 0px 0px 2px var(--_primary-100);
511
- border: 1px solid var(--_primary-300);
512
- }
513
- }
514
- .delivery_details_container {
515
- .delivery_details_title {
516
- display: inline-block;
517
- margin-top: 8px;
518
- margin-bottom: 4px;
519
- font-size: 16px;
520
- color: #000000;
521
- font-weight: 500;
522
- line-height: 150%;
523
- }
524
- .input_container {
525
- display: flex;
526
- flex-direction: column;
527
- gap: 4px;
528
- margin-bottom: 12px;
529
-
530
- &:last-child {
531
- margin-bottom: 0;
532
- }
533
- label {
534
- display: block;
535
- color: var(--_gray-700);
536
- font-weight: 500;
537
- font-size: 14px;
538
- line-height: 20px;
539
- }
540
- .message_text {
541
- background-color: var(--_base-white);
542
- padding: 8px 12px;
543
- border: 1px solid var(--_gray-300);
544
- border-radius: 4px;
545
- transition:
546
- background-color 0.2s,
547
- color 0.2s,
548
- border-color 0.2s,
549
- box-shadow 0.2s;
550
- &::placeholder {
551
- color: var(--_gray-500);
552
- font-weight: 500;
553
- font-size: 14px;
554
- line-height: 24px;
555
- }
556
- &:focus {
557
- outline: 0 none;
558
- outline-offset: 0;
559
- border-radius: 4px;
560
- box-shadow:
561
- 0px 1px 2px rgba(16, 24, 40, 0.05),
562
- 0px 0px 0px 2px var(--_primary-100);
563
- border: 1px solid var(--_primary-300);
564
- }
565
- }
566
- input {
567
- background-color: var(--_base-white);
568
- padding: 8px 12px;
569
- border: 1px solid var(--_gray-300);
570
- border-radius: 4px;
571
- height: 40px;
572
- transition:
573
- background-color 0.2s,
574
- color 0.2s,
575
- border-color 0.2s,
576
- box-shadow 0.2s;
577
- &::placeholder {
578
- color: var(--_gray-500);
579
- font-weight: 500;
580
- font-size: 14px;
581
- line-height: 24px;
582
- }
583
- &:focus {
584
- outline: 0 none;
585
- outline-offset: 0;
586
- border-radius: 4px;
587
- box-shadow:
588
- 0px 1px 2px rgba(16, 24, 40, 0.05),
589
- 0px 0px 0px 2px var(--_primary-100);
590
- border: 1px solid var(--_primary-300);
591
- }
592
- }
593
- }
594
- }
620
+ // background-color: #f5f5f5;
621
+ // border: 1px solid #3e4784;
622
+ // color: #000080;
595
623
  }
596
624
  }
597
- .product-actual-price-container {
598
- .product-actual-discount {
599
- .discount-percentage {
600
- background-color: var(
601
- --_ctm-mob-dn-dt-bd-cr,
602
- var(--_ctm-tab-dn-dt-bd-cr, var(--_ctm-dn-dt-bd-cr))
603
- );
604
- color: var(--_ctm-mob-dn-dt-cr, var(--_ctm-tab-dn-dt-cr, var(--_ctm-dn-dt-cr)));
625
+ }
626
+ .custom_amount_container {
627
+ display: flex;
628
+ flex-direction: column;
629
+ gap: 8px;
630
+ .custom_amount_label {
631
+ font-family: var(
632
+ --_ctm-mob-dn-gt-cd-ls-ft-fy,
633
+ var(--_ctm-tab-dn-gt-cd-ls-ft-fy, var(--_ctm-dn-gt-cd-ls-ft-fy))
634
+ );
635
+ color: var(
636
+ --_ctm-mob-dn-gt-cd-ls-cr,
637
+ var(--_ctm-tab-dn-gt-cd-ls-cr, var(--_ctm-dn-gt-cd-ls-cr))
638
+ );
639
+ font-weight: var(
640
+ --_ctm-mob-dn-gt-cd-ls-ft-wt,
641
+ var(--_ctm-tab-dn-gt-cd-ls-ft-wt, var(--_ctm-dn-gt-cd-ls-ft-wt))
642
+ );
643
+ font-size: var(
644
+ --_ctm-mob-dn-gt-cd-ls-ft-se,
645
+ var(--_ctm-tab-dn-gt-cd-ls-ft-se, var(--_ctm-dn-gt-cd-ls-ft-se))
646
+ );
647
+ text-decoration: var(
648
+ --_ctm-mob-dn-gt-cd-ls-ue,
649
+ var(--_ctm-tab-dn-gt-cd-ls-ue, var(--_ctm-dn-gt-cd-ls-ue))
650
+ );
651
+ letter-spacing: var(
652
+ --_ctm-mob-dn-gt-cd-ls-lr-sg,
653
+ var(--_ctm-tab-dn-gt-cd-ls-lr-sg, var(--_ctm-dn-gt-cd-ls-lr-sg))
654
+ );
655
+ line-height: var(
656
+ --_ctm-mob-dn-gt-cd-ls-le-ht,
657
+ var(--_ctm-tab-dn-gt-cd-ls-le-ht, var(--_ctm-dn-gt-cd-ls-le-ht))
658
+ );
659
+ font-style: var(
660
+ --_ctm-mob-dn-gt-cd-ls-ft-se-ic,
661
+ var(--_ctm-tab-dn-gt-cd-ls-ft-se-ic, var(--_ctm-dn-gt-cd-ls-ft-se-ic))
662
+ );
663
+ text-align: var(
664
+ --_ctm-mob-dn-gt-cd-ls-tt-an,
665
+ var(--_ctm-tab-dn-gt-cd-ls-tt-an, var(--_ctm-dn-gt-cd-ls-tt-an))
666
+ );
667
+ padding: var(
668
+ --_ctm-mob-dn-gt-cd-ls-pg,
669
+ var(--_ctm-tab-dn-gt-cd-ls-pg, var(--_ctm-dn-gt-cd-ls-pg))
670
+ );
671
+ }
672
+ .custom_amount_input {
673
+ height: 40px;
674
+ display: flex;
675
+ position: relative;
676
+ // gap: 6px;
677
+ align-items: center;
678
+ // border-radius: 4px;
679
+ // background: #fff;
680
+ // border: 1px solid #d0d5dd;
681
+ // padding: 8px 12px;
682
+ background-color: var(
683
+ --_ctm-mob-dn-gt-cd-is-bd-cr,
684
+ var(--_ctm-tab-dn-gt-cd-is-bd-cr, var(--_ctm-dn-gt-cd-is-bd-cr))
685
+ );
686
+
687
+ border-color: var(
688
+ --_ctm-mob-dn-gt-cd-is-br-cr,
689
+ var(--_ctm-tab-dn-gt-cd-is-br-cr, var(--_ctm-dn-gt-cd-is-br-cr))
690
+ );
691
+ border-radius: var(
692
+ --_ctm-mob-dn-gt-cd-is-br-rs,
693
+ var(--_ctm-tab-dn-gt-cd-is-br-rs, var(--_ctm-dn-gt-cd-is-br-rs))
694
+ );
695
+ border-style: var(
696
+ --_ctm-mob-dn-gt-cd-is-br-se,
697
+ var(--_ctm-tab-dn-gt-cd-is-br-se, var(--_ctm-dn-gt-cd-is-br-se))
698
+ );
699
+ border-width: var(
700
+ --_ctm-mob-dn-gt-cd-is-br-wh,
701
+ var(--_ctm-tab-dn-gt-cd-is-br-wh, var(--_ctm-dn-gt-cd-is-br-wh))
702
+ );
703
+ padding: var(
704
+ --_ctm-mob-dn-gt-cd-is-pg,
705
+ var(--_ctm-tab-dn-gt-cd-is-pg, var(--_ctm-dn-gt-cd-is-pg))
706
+ );
707
+ // width: 220px;
708
+ transition:
709
+ background-color 0.2s,
710
+ color 0.2s,
711
+ border-color 0.2s,
712
+ box-shadow 0.2s;
713
+ .svg_icon {
714
+ color: var(--_gray-700);
715
+ font-weight: 500;
716
+ font-size: 14px;
717
+ line-height: 24px;
718
+ white-space: nowrap;
719
+ }
720
+ input {
721
+ color: var(--_gray-700);
722
+ margin-top: 2px;
723
+ &::placeholder {
605
724
  font-family: var(
606
- --_ctm-mob-dn-dt-ft-fy,
607
- var(--_ctm-tab-dn-dt-ft-fy, var(--_ctm-dn-dt-ft-fy))
608
- ),
609
- sans-serif;
610
- font-size: var(
611
- --_ctm-mob-dn-dt-ft-se,
612
- var(--_ctm-tab-dn-dt-ft-se, var(--_ctm-dn-dt-ft-se))
613
- );
614
- font-weight: var(
615
- --_ctm-mob-dn-dt-ft-wt,
616
- var(--_ctm-tab-dn-dt-ft-wt, var(--_ctm-dn-dt-ft-wt))
617
- );
618
- font-style: var(
619
- --_ctm-mob-dn-dt-ft-se-ic,
620
- var(--_ctm-tab-dn-dt-ft-se-ic, var(--_ctm-dn-dt-ft-se-ic))
621
- );
622
- text-align: var(
623
- --_ctm-mob-dn-dt-tt-an,
624
- var(--_ctm-tab-dn-dt-tt-an, var(--_ctm-dn-dt-tt-an))
625
- );
626
- letter-spacing: var(
627
- --_ctm-mob-dn-dt-lr-sg,
628
- var(--_ctm-tab-dn-dt-lr-sg, var(--_ctm-dn-dt-lr-sg))
629
- );
630
- line-height: var(
631
- --_ctm-mob-dn-dt-le-ht,
632
- var(--_ctm-tab-dn-dt-le-ht, var(--_ctm-dn-dt-le-ht))
633
- );
634
- text-decoration: var(
635
- --_ctm-mob-dn-dt-ue,
636
- var(--_ctm-tab-dn-dt-ue, var(--_ctm-dn-dt-ue))
637
- );
638
-
639
- border-color: var(
640
- --_show-border,
641
- var(--_ctm-mob-dn-dt-br-cr, var(--_ctm-tab-dn-dt-br-cr, var(--_ctm-dn-dt-br-cr)))
642
- );
643
- border-style: var(
644
- --_show-border,
645
- var(--_ctm-mob-dn-dt-br-se, var(--_ctm-tab-dn-dt-br-se, var(--_ctm-dn-dt-br-se)))
646
- );
647
- border-width: var(
648
- --_show-border,
649
- var(--_ctm-mob-dn-dt-br-wh, var(--_ctm-tab-dn-dt-br-wh, var(--_ctm-dn-dt-br-wh)))
650
- );
651
- border-radius: var(
652
- --_ctm-mob-dn-dt-br-rs,
653
- var(--_ctm-tab-dn-dt-br-rs, var(--_ctm-dn-dt-br-rs))
654
- );
655
-
656
- box-shadow: var(
657
- --_show-shadow,
658
- var(--_ctm-mob-dn-dt-sw-ae, var(--_ctm-tab-dn-dt-sw-ae, var(--_ctm-dn-dt-sw-ae)))
659
- var(
660
- --_ctm-mob-dn-dt-sw-br,
661
- var(--_ctm-tab-dn-dt-sw-br, var(--_ctm-dn-dt-sw-br))
662
- )
663
- var(
664
- --_ctm-mob-dn-dt-sw-sd,
665
- var(--_ctm-tab-dn-dt-sw-sd, var(--_ctm-dn-dt-sw-sd))
666
- )
667
- var(
668
- --_ctm-mob-dn-dt-sw-cr,
669
- var(--_ctm-tab-dn-dt-sw-cr, var(--_ctm-dn-dt-sw-cr))
670
- )
671
- );
672
- }
673
-
674
- .discount-value-percentage {
675
- background-color: var(
676
- --_ctm-mob-dn-dt-ve-bd-cr,
677
- var(--_ctm-tab-dn-dt-ve-bd-cr, var(--_ctm-dn-dt-ve-bd-cr))
725
+ --_ctm-mob-dn-gt-cd-is-ft-fy,
726
+ var(--_ctm-tab-dn-gt-cd-is-ft-fy, var(--_ctm-dn-gt-cd-is-ft-fy))
678
727
  );
679
728
  color: var(
680
- --_ctm-mob-dn-dt-ve-cr,
681
- var(--_ctm-tab-dn-dt-ve-cr, var(--_ctm-dn-dt-ve-cr))
682
- );
683
- font-family: var(
684
- --_ctm-mob-dn-dt-ve-ft-fy,
685
- var(--_ctm-tab-dn-dt-ve-ft-fy, var(--_ctm-dn-dt-ve-ft-fy))
686
- ),
687
- sans-serif;
688
- font-size: var(
689
- --_ctm-mob-dn-dt-ve-ft-se,
690
- var(--_ctm-tab-dn-dt-ve-ft-se, var(--_ctm-dn-dt-ve-ft-se))
729
+ --_ctm-mob-dn-gt-cd-is-cr,
730
+ var(--_ctm-tab-dn-gt-cd-is-cr, var(--_ctm-dn-gt-cd-is-cr))
691
731
  );
692
732
  font-weight: var(
693
- --_ctm-mob-dn-dt-ve-ft-wt,
694
- var(--_ctm-tab-dn-dt-ve-ft-wt, var(--_ctm-dn-dt-ve-ft-wt))
733
+ --_ctm-mob-dn-gt-cd-is-ft-wt,
734
+ var(--_ctm-tab-dn-gt-cd-is-ft-wt, var(--_ctm-dn-gt-cd-is-ft-wt))
695
735
  );
696
- font-style: var(
697
- --_ctm-mob-dn-dt-ve-ft-se-ic,
698
- var(--_ctm-tab-dn-dt-ve-ft-se-ic, var(--_ctm-dn-dt-ve-ft-se-ic))
699
- );
700
- text-align: var(
701
- --_ctm-mob-dn-dt-ve-tt-an,
702
- var(--_ctm-tab-dn-dt-ve-tt-an, var(--_ctm-dn-dt-ve-tt-an))
703
- );
704
- letter-spacing: var(
705
- --_ctm-mob-dn-dt-ve-lr-sg,
706
- var(--_ctm-tab-dn-dt-ve-lr-sg, var(--_ctm-dn-dt-ve-lr-sg))
707
- );
708
- line-height: var(
709
- --_ctm-mob-dn-dt-ve-le-ht,
710
- var(--_ctm-tab-dn-dt-ve-le-ht, var(--_ctm-dn-dt-ve-le-ht))
711
- );
712
- text-decoration: var(
713
- --_ctm-mob-dn-dt-ve-ue,
714
- var(--_ctm-tab-dn-dt-ve-ue, var(--_ctm-dn-dt-ve-ue))
715
- );
716
-
717
- border-color: var(
718
- --_show-border,
719
- var(
720
- --_ctm-mob-dn-dt-ve-br-cr,
721
- var(--_ctm-tab-dn-dt-ve-br-cr, var(--_ctm-dn-dt-ve-br-cr))
722
- )
723
- );
724
- border-style: var(
725
- --_show-border,
726
- var(
727
- --_ctm-mob-dn-dt-ve-br-se,
728
- var(--_ctm-tab-dn-dt-ve-br-se, var(--_ctm-dn-dt-ve-br-se))
729
- )
730
- );
731
- border-width: var(
732
- --_show-border,
733
- var(
734
- --_ctm-mob-dn-dt-ve-br-wh,
735
- var(--_ctm-tab-dn-dt-ve-br-wh, var(--_ctm-dn-dt-ve-br-wh))
736
- )
737
- );
738
- border-radius: var(
739
- --_ctm-mob-dn-dt-ve-br-rs,
740
- var(--_ctm-tab-dn-dt-ve-br-rs, var(--_ctm-dn-dt-ve-br-rs))
741
- );
742
-
743
- box-shadow: var(
744
- --_show-shadow,
745
- var(
746
- --_ctm-mob-dn-dt-ve-sw-ae,
747
- var(--_ctm-tab-dn-dt-ve-sw-ae, var(--_ctm-dn-dt-ve-sw-ae))
748
- )
749
- var(
750
- --_ctm-mob-dn-dt-ve-sw-br,
751
- var(--_ctm-tab-dn-dt-ve-sw-br, var(--_ctm-dn-dt-ve-sw-br))
752
- )
753
- var(
754
- --_ctm-mob-dn-dt-ve-sw-sd,
755
- var(--_ctm-tab-dn-dt-ve-sw-sd, var(--_ctm-dn-dt-ve-sw-sd))
756
- )
757
- var(
758
- --_ctm-mob-dn-dt-ve-sw-cr,
759
- var(--_ctm-tab-dn-dt-ve-sw-cr, var(--_ctm-dn-dt-ve-sw-cr))
760
- )
761
- );
762
- }
763
- }
764
- .product-actual-price {
765
- .actual-price-span {
766
- background-color: var(
767
- --_ctm-mob-dn-al-pe-bd-cr,
768
- var(--_ctm-tab-dn-al-pe-bd-cr, var(--_ctm-dn-al-pe-bd-cr))
769
- );
770
- color: var(
771
- --_ctm-mob-dn-al-pe-cr,
772
- var(--_ctm-tab-dn-al-pe-cr, var(--_ctm-dn-al-pe-cr))
773
- );
774
- font-family: var(
775
- --_ctm-mob-dn-al-pe-ft-fy,
776
- var(--_ctm-tab-dn-al-pe-ft-fy, var(--_ctm-dn-al-pe-ft-fy))
777
- ),
778
- sans-serif;
779
736
  font-size: var(
780
- --_ctm-mob-dn-al-pe-ft-se,
781
- var(--_ctm-tab-dn-al-pe-ft-se, var(--_ctm-dn-al-pe-ft-se))
782
- );
783
- font-weight: var(
784
- --_ctm-mob-dn-al-pe-ft-wt,
785
- var(--_ctm-tab-dn-al-pe-ft-wt, var(--_ctm-dn-al-pe-ft-wt))
786
- );
787
- font-style: var(
788
- --_ctm-mob-dn-al-pe-ft-se-ic,
789
- var(--_ctm-tab-dn-al-pe-ft-se-ic, var(--_ctm-dn-al-pe-ft-se-ic))
790
- );
791
- text-align: var(
792
- --_ctm-mob-dn-al-pe-tt-an,
793
- var(--_ctm-tab-dn-al-pe-tt-an, var(--_ctm-dn-al-pe-tt-an))
794
- );
795
- letter-spacing: var(
796
- --_ctm-mob-dn-al-pe-lr-sg,
797
- var(--_ctm-tab-dn-al-pe-lr-sg, var(--_ctm-dn-al-pe-lr-sg))
798
- );
799
- line-height: var(
800
- --_ctm-mob-dn-al-pe-le-ht,
801
- var(--_ctm-tab-dn-al-pe-le-ht, var(--_ctm-dn-al-pe-le-ht))
737
+ --_ctm-mob-dn-gt-cd-is-ft-se,
738
+ var(--_ctm-tab-dn-gt-cd-is-ft-se, var(--_ctm-dn-gt-cd-is-ft-se))
802
739
  );
803
740
  text-decoration: var(
804
- --_ctm-mob-dn-al-pe-ue,
805
- var(--_ctm-tab-dn-al-pe-ue, var(--_ctm-dn-al-pe-ue))
806
- );
807
-
808
- border-color: var(
809
- --_show-border,
810
- var(
811
- --_ctm-mob-dn-al-pe-br-cr,
812
- var(--_ctm-tab-dn-al-pe-br-cr, var(--_ctm-dn-al-pe-br-cr))
813
- )
814
- );
815
- border-style: var(
816
- --_show-border,
817
- var(
818
- --_ctm-mob-dn-al-pe-br-se,
819
- var(--_ctm-tab-dn-al-pe-br-se, var(--_ctm-dn-al-pe-br-se))
820
- )
821
- );
822
- border-width: var(
823
- --_show-border,
824
- var(
825
- --_ctm-mob-dn-al-pe-br-wh,
826
- var(--_ctm-tab-dn-al-pe-br-wh, var(--_ctm-dn-al-pe-br-wh))
827
- )
828
- );
829
- border-radius: var(
830
- --_ctm-mob-dn-al-pe-br-rs,
831
- var(--_ctm-tab-dn-al-pe-br-rs, var(--_ctm-dn-al-pe-br-rs))
832
- );
833
-
834
- box-shadow: var(
835
- --_show-shadow,
836
- var(
837
- --_ctm-mob-dn-al-pe-sw-ae,
838
- var(--_ctm-tab-dn-al-pe-sw-ae, var(--_ctm-dn-al-pe-sw-ae))
839
- )
840
- var(
841
- --_ctm-mob-dn-al-pe-sw-br,
842
- var(--_ctm-tab-dn-al-pe-sw-br, var(--_ctm-dn-al-pe-sw-br))
843
- )
844
- var(
845
- --_ctm-mob-dn-al-pe-sw-sd,
846
- var(--_ctm-tab-dn-al-pe-sw-sd, var(--_ctm-dn-al-pe-sw-sd))
847
- )
848
- var(
849
- --_ctm-mob-dn-al-pe-sw-cr,
850
- var(--_ctm-tab-dn-al-pe-sw-cr, var(--_ctm-dn-al-pe-sw-cr))
851
- )
852
- );
853
- }
854
-
855
- .code-span {
856
- background-color: var(
857
- --_ctm-mob-dn-cy-ce-se-bd-cr,
858
- var(--_ctm-tab-dn-cy-ce-se-bd-cr, var(--_ctm-dn-cy-ce-se-bd-cr))
859
- );
860
- color: var(
861
- --_ctm-mob-dn-cy-ce-se-cr,
862
- var(--_ctm-tab-dn-cy-ce-se-cr, var(--_ctm-dn-cy-ce-se-cr))
863
- );
864
- font-family: var(
865
- --_ctm-mob-dn-cy-ce-se-ft-fy,
866
- var(--_ctm-tab-dn-cy-ce-se-ft-fy, var(--_ctm-dn-cy-ce-se-ft-fy))
867
- ),
868
- sans-serif;
869
- font-size: var(
870
- --_ctm-mob-dn-cy-ce-se-ft-se,
871
- var(--_ctm-tab-dn-cy-ce-se-ft-se, var(--_ctm-dn-cy-ce-se-ft-se))
872
- );
873
- font-weight: var(
874
- --_ctm-mob-dn-cy-ce-se-ft-wt,
875
- var(--_ctm-tab-dn-cy-ce-se-ft-wt, var(--_ctm-dn-cy-ce-se-ft-wt))
876
- );
877
- font-style: var(
878
- --_ctm-mob-dn-cy-ce-se-ft-se-ic,
879
- var(--_ctm-tab-dn-cy-ce-se-ft-se-ic, var(--_ctm-dn-cy-ce-se-ft-se-ic))
880
- );
881
- text-align: var(
882
- --_ctm-mob-dn-cy-ce-se-tt-an,
883
- var(--_ctm-tab-dn-cy-ce-se-tt-an, var(--_ctm-dn-cy-ce-se-tt-an))
741
+ --_ctm-mob-dn-gt-cd-is-ue,
742
+ var(--_ctm-tab-dn-gt-cd-is-ue, var(--_ctm-dn-gt-cd-is-ue))
884
743
  );
885
744
  letter-spacing: var(
886
- --_ctm-mob-dn-cy-ce-se-lr-sg,
887
- var(--_ctm-tab-dn-cy-ce-se-lr-sg, var(--_ctm-dn-cy-ce-se-lr-sg))
745
+ --_ctm-mob-dn-gt-cd-is-lr-sg,
746
+ var(--_ctm-tab-dn-gt-cd-is-lr-sg, var(--_ctm-dn-gt-cd-is-lr-sg))
888
747
  );
889
748
  line-height: var(
890
- --_ctm-mob-dn-cy-ce-se-le-ht,
891
- var(--_ctm-tab-dn-cy-ce-se-le-ht, var(--_ctm-dn-cy-ce-se-le-ht))
892
- );
893
- text-decoration: var(
894
- --_ctm-mob-dn-cy-ce-se-ue,
895
- var(--_ctm-tab-dn-cy-ce-se-ue, var(--_ctm-dn-cy-ce-se-ue))
896
- );
897
-
898
- border-color: var(
899
- --_show-border,
900
- var(
901
- --_ctm-mob-dn-cy-ce-se-br-cr,
902
- var(--_ctm-tab-dn-cy-ce-se-br-cr, var(--_ctm-dn-cy-ce-se-br-cr))
903
- )
904
- );
905
- border-style: var(
906
- --_show-border,
907
- var(
908
- --_ctm-mob-dn-cy-ce-se-br-se,
909
- var(--_ctm-tab-dn-cy-ce-se-br-se, var(--_ctm-dn-cy-ce-se-br-se))
910
- )
911
- );
912
- border-width: var(
913
- --_show-border,
914
- var(
915
- --_ctm-mob-dn-cy-ce-se-br-wh,
916
- var(--_ctm-tab-dn-cy-ce-se-br-wh, var(--_ctm-dn-cy-ce-se-br-wh))
917
- )
918
- );
919
- border-radius: var(
920
- --_ctm-mob-dn-cy-ce-se-br-rs,
921
- var(--_ctm-tab-dn-cy-ce-se-br-rs, var(--_ctm-dn-cy-ce-se-br-rs))
922
- );
923
-
924
- box-shadow: var(
925
- --_show-shadow,
926
- var(
927
- --_ctm-mob-dn-cy-ce-se-sw-ae,
928
- var(--_ctm-tab-dn-cy-ce-se-sw-ae, var(--_ctm-dn-cy-ce-se-sw-ae))
929
- )
930
- var(
931
- --_ctm-mob-dn-cy-ce-se-sw-br,
932
- var(--_ctm-tab-dn-cy-ce-se-sw-br, var(--_ctm-dn-cy-ce-se-sw-br))
933
- )
934
- var(
935
- --_ctm-mob-dn-cy-ce-se-sw-sd,
936
- var(--_ctm-tab-dn-cy-ce-se-sw-sd, var(--_ctm-dn-cy-ce-se-sw-sd))
937
- )
938
- var(
939
- --_ctm-mob-dn-cy-ce-se-sw-cr,
940
- var(--_ctm-tab-dn-cy-ce-se-sw-cr, var(--_ctm-dn-cy-ce-se-sw-cr))
941
- )
942
- );
943
- }
944
-
945
- .uom-span {
946
- background-color: var(
947
- --_ctm-mob-dn-um-se-bd-cr,
948
- var(--_ctm-tab-dn-um-se-bd-cr, var(--_ctm-dn-um-se-bd-cr))
949
- );
950
- color: var(
951
- --_ctm-mob-dn-um-se-cr,
952
- var(--_ctm-tab-dn-um-se-cr, var(--_ctm-dn-um-se-cr))
953
- );
954
- font-family: var(
955
- --_ctm-mob-dn-um-se-ft-fy,
956
- var(--_ctm-tab-dn-um-se-ft-fy, var(--_ctm-dn-um-se-ft-fy))
957
- ),
958
- sans-serif;
959
- font-size: var(
960
- --_ctm-mob-dn-um-se-ft-se,
961
- var(--_ctm-tab-dn-um-se-ft-se, var(--_ctm-dn-um-se-ft-se))
962
- );
963
- font-weight: var(
964
- --_ctm-mob-dn-um-se-ft-wt,
965
- var(--_ctm-tab-dn-um-se-ft-wt, var(--_ctm-dn-um-se-ft-wt))
749
+ --_ctm-mob-dn-gt-cd-is-le-ht,
750
+ var(--_ctm-tab-dn-gt-cd-is-le-ht, var(--_ctm-dn-gt-cd-is-le-ht))
966
751
  );
967
752
  font-style: var(
968
- --_ctm-mob-dn-um-se-ft-se-ic,
969
- var(--_ctm-tab-dn-um-se-ft-se-ic, var(--_ctm-dn-um-se-ft-se-ic))
753
+ --_ctm-mob-dn-gt-cd-is-ft-se-ic,
754
+ var(--_ctm-tab-dn-gt-cd-is-ft-se-ic, var(--_ctm-dn-gt-cd-is-ft-se-ic))
970
755
  );
971
756
  text-align: var(
972
- --_ctm-mob-dn-um-se-tt-an,
973
- var(--_ctm-tab-dn-um-se-tt-an, var(--_ctm-dn-um-se-tt-an))
974
- );
975
- letter-spacing: var(
976
- --_ctm-mob-dn-um-se-lr-sg,
977
- var(--_ctm-tab-dn-um-se-lr-sg, var(--_ctm-dn-um-se-lr-sg))
978
- );
979
- line-height: var(
980
- --_ctm-mob-dn-um-se-le-ht,
981
- var(--_ctm-tab-dn-um-se-le-ht, var(--_ctm-dn-um-se-le-ht))
982
- );
983
- text-decoration: var(
984
- --_ctm-mob-dn-um-se-ue,
985
- var(--_ctm-tab-dn-um-se-ue, var(--_ctm-dn-um-se-ue))
986
- );
987
-
988
- border-color: var(
989
- --_show-border,
990
- var(
991
- --_ctm-mob-dn-um-se-br-cr,
992
- var(--_ctm-tab-dn-um-se-br-cr, var(--_ctm-dn-um-se-br-cr))
993
- )
994
- );
995
- border-style: var(
996
- --_show-border,
997
- var(
998
- --_ctm-mob-dn-um-se-br-se,
999
- var(--_ctm-tab-dn-um-se-br-se, var(--_ctm-dn-um-se-br-se))
1000
- )
1001
- );
1002
- border-width: var(
1003
- --_show-border,
1004
- var(
1005
- --_ctm-mob-dn-um-se-br-wh,
1006
- var(--_ctm-tab-dn-um-se-br-wh, var(--_ctm-dn-um-se-br-wh))
1007
- )
1008
- );
1009
- border-radius: var(
1010
- --_ctm-mob-dn-um-se-br-rs,
1011
- var(--_ctm-tab-dn-um-se-br-rs, var(--_ctm-dn-um-se-br-rs))
1012
- );
1013
-
1014
- box-shadow: var(
1015
- --_show-shadow,
1016
- var(
1017
- --_ctm-mob-dn-um-se-sw-ae,
1018
- var(--_ctm-tab-dn-um-se-sw-ae, var(--_ctm-dn-um-se-sw-ae))
1019
- )
1020
- var(
1021
- --_ctm-mob-dn-um-se-sw-br,
1022
- var(--_ctm-tab-dn-um-se-sw-br, var(--_ctm-dn-um-se-sw-br))
1023
- )
1024
- var(
1025
- --_ctm-mob-dn-um-se-sw-sd,
1026
- var(--_ctm-tab-dn-um-se-sw-sd, var(--_ctm-dn-um-se-sw-sd))
1027
- )
1028
- var(
1029
- --_ctm-mob-dn-um-se-sw-cr,
1030
- var(--_ctm-tab-dn-um-se-sw-cr, var(--_ctm-dn-um-se-sw-cr))
1031
- )
757
+ --_ctm-mob-dn-gt-cd-is-tt-an,
758
+ var(--_ctm-tab-dn-gt-cd-is-tt-an, var(--_ctm-dn-gt-cd-is-tt-an))
1032
759
  );
760
+ // color: var(--_gray-500);
761
+ // font-weight: 500;
762
+ // font-size: 14px;
763
+ // line-height: 24px;
1033
764
  }
1034
765
  }
1035
- }
1036
- .product-savings {
1037
- .product-savings-wrapper {
1038
- .savings-percent-span {
1039
- background-color: var(
1040
- --_ctm-mob-dn-ss-bd-cr,
1041
- var(--_ctm-tab-dn-ss-bd-cr, var(--_ctm-dn-ss-bd-cr))
1042
- );
1043
- color: var(--_ctm-mob-dn-ss-cr, var(--_ctm-tab-dn-ss-cr, var(--_ctm-dn-ss-cr)));
1044
- font-family: var(
1045
- --_ctm-mob-dn-ss-ft-fy,
1046
- var(--_ctm-tab-dn-ss-ft-fy, var(--_ctm-dn-ss-ft-fy))
1047
- ),
1048
- sans-serif;
1049
- font-size: var(
1050
- --_ctm-mob-dn-ss-ft-se,
1051
- var(--_ctm-tab-dn-ss-ft-se, var(--_ctm-dn-ss-ft-se))
1052
- );
1053
- font-weight: var(
1054
- --_ctm-mob-dn-ss-ft-wt,
1055
- var(--_ctm-tab-dn-ss-ft-wt, var(--_ctm-dn-ss-ft-wt))
1056
- );
1057
- font-style: var(
1058
- --_ctm-mob-dn-ss-ft-se-ic,
1059
- var(--_ctm-tab-dn-ss-ft-se-ic, var(--_ctm-dn-ss-ft-se-ic))
1060
- );
1061
- text-align: var(
1062
- --_ctm-mob-dn-ss-tt-an,
1063
- var(--_ctm-tab-dn-ss-tt-an, var(--_ctm-dn-ss-tt-an))
1064
- );
1065
- letter-spacing: var(
1066
- --_ctm-mob-dn-ss-lr-sg,
1067
- var(--_ctm-tab-dn-ss-lr-sg, var(--_ctm-dn-ss-lr-sg))
1068
- );
1069
- line-height: var(
1070
- --_ctm-mob-dn-ss-le-ht,
1071
- var(--_ctm-tab-dn-ss-le-ht, var(--_ctm-dn-ss-le-ht))
1072
- );
1073
- text-decoration: var(
1074
- --_ctm-mob-dn-ss-ue,
1075
- var(--_ctm-tab-dn-ss-ue, var(--_ctm-dn-ss-ue))
1076
- );
1077
-
1078
- border-color: var(
1079
- --_show-border,
1080
- var(--_ctm-mob-dn-ss-br-cr, var(--_ctm-tab-dn-ss-br-cr, var(--_ctm-dn-ss-br-cr)))
1081
- );
1082
- border-style: var(
1083
- --_show-border,
1084
- var(--_ctm-mob-dn-ss-br-se, var(--_ctm-tab-dn-ss-br-se, var(--_ctm-dn-ss-br-se)))
1085
- );
1086
- border-width: var(
1087
- --_show-border,
1088
- var(--_ctm-mob-dn-ss-br-wh, var(--_ctm-tab-dn-ss-br-wh, var(--_ctm-dn-ss-br-wh)))
1089
- );
1090
- border-radius: var(
1091
- --_ctm-mob-dn-ss-br-rs,
1092
- var(--_ctm-tab-dn-ss-br-rs, var(--_ctm-dn-ss-br-rs))
1093
- );
1094
-
1095
- box-shadow: var(
1096
- --_show-shadow,
1097
- var(--_ctm-mob-dn-ss-sw-ae, var(--_ctm-tab-dn-ss-sw-ae, var(--_ctm-dn-ss-sw-ae)))
1098
- var(
1099
- --_ctm-mob-dn-ss-sw-br,
1100
- var(--_ctm-tab-dn-ss-sw-br, var(--_ctm-dn-ss-sw-br))
1101
- )
1102
- var(
1103
- --_ctm-mob-dn-ss-sw-sd,
1104
- var(--_ctm-tab-dn-ss-sw-sd, var(--_ctm-dn-ss-sw-sd))
1105
- )
1106
- var(
1107
- --_ctm-mob-dn-ss-sw-cr,
1108
- var(--_ctm-tab-dn-ss-sw-cr, var(--_ctm-dn-ss-sw-cr))
1109
- )
1110
- );
1111
- }
1112
- .savings-value-span {
1113
- background-color: var(
1114
- --_ctm-mob-dn-ss-ve-bd-cr,
1115
- var(--_ctm-tab-dn-ss-ve-bd-cr, var(--_ctm-dn-ss-ve-bd-cr))
1116
- );
1117
- color: var(
1118
- --_ctm-mob-dn-ss-ve-cr,
1119
- var(--_ctm-tab-dn-ss-ve-cr, var(--_ctm-dn-ss-ve-cr))
1120
- );
1121
- font-family: var(
1122
- --_ctm-mob-dn-ss-ve-ft-fy,
1123
- var(--_ctm-tab-dn-ss-ve-ft-fy, var(--_ctm-dn-ss-ve-ft-fy))
1124
- ),
1125
- sans-serif;
1126
- font-size: var(
1127
- --_ctm-mob-dn-ss-ve-ft-se,
1128
- var(--_ctm-tab-dn-ss-ve-ft-se, var(--_ctm-dn-ss-ve-ft-se))
1129
- );
1130
- font-weight: var(
1131
- --_ctm-mob-dn-ss-ve-ft-wt,
1132
- var(--_ctm-tab-dn-ss-ve-ft-wt, var(--_ctm-dn-ss-ve-ft-wt))
1133
- );
1134
- font-style: var(
1135
- --_ctm-mob-dn-ss-ve-ft-se-ic,
1136
- var(--_ctm-tab-dn-ss-ve-ft-se-ic, var(--_ctm-dn-ss-ve-ft-se-ic))
1137
- );
1138
- text-align: var(
1139
- --_ctm-mob-dn-ss-ve-tt-an,
1140
- var(--_ctm-tab-dn-ss-ve-tt-an, var(--_ctm-dn-ss-ve-tt-an))
1141
- );
1142
- letter-spacing: var(
1143
- --_ctm-mob-dn-ss-ve-lr-sg,
1144
- var(--_ctm-tab-dn-ss-ve-lr-sg, var(--_ctm-dn-ss-ve-lr-sg))
1145
- );
1146
- line-height: var(
1147
- --_ctm-mob-dn-ss-ve-le-ht,
1148
- var(--_ctm-tab-dn-ss-ve-le-ht, var(--_ctm-dn-ss-ve-le-ht))
1149
- );
1150
- text-decoration: var(
1151
- --_ctm-mob-dn-ss-ve-ue,
1152
- var(--_ctm-tab-dn-ss-ve-ue, var(--_ctm-dn-ss-ve-ue))
1153
- );
1154
-
1155
- border-color: var(
1156
- --_show-border,
1157
- var(
1158
- --_ctm-mob-dn-ss-ve-br-cr,
1159
- var(--_ctm-tab-dn-ss-ve-br-cr, var(--_ctm-dn-ss-ve-br-cr))
1160
- )
1161
- );
1162
- border-style: var(
1163
- --_show-border,
1164
- var(
1165
- --_ctm-mob-dn-ss-ve-br-se,
1166
- var(--_ctm-tab-dn-ss-ve-br-se, var(--_ctm-dn-ss-ve-br-se))
1167
- )
1168
- );
1169
- border-width: var(
1170
- --_show-border,
1171
- var(
1172
- --_ctm-mob-dn-ss-ve-br-wh,
1173
- var(--_ctm-tab-dn-ss-ve-br-wh, var(--_ctm-dn-ss-ve-br-wh))
1174
- )
1175
- );
1176
- border-radius: var(
1177
- --_ctm-mob-dn-ss-ve-br-rs,
1178
- var(--_ctm-tab-dn-ss-ve-br-rs, var(--_ctm-dn-ss-ve-br-rs))
1179
- );
1180
-
1181
- box-shadow: var(
1182
- --_show-shadow,
1183
- var(
1184
- --_ctm-mob-dn-ss-ve-sw-ae,
1185
- var(--_ctm-tab-dn-ss-ve-sw-ae, var(--_ctm-dn-ss-ve-sw-ae))
1186
- )
1187
- var(
1188
- --_ctm-mob-dn-ss-ve-sw-br,
1189
- var(--_ctm-tab-dn-ss-ve-sw-br, var(--_ctm-dn-ss-ve-sw-br))
1190
- )
1191
- var(
1192
- --_ctm-mob-dn-ss-ve-sw-sd,
1193
- var(--_ctm-tab-dn-ss-ve-sw-sd, var(--_ctm-dn-ss-ve-sw-sd))
1194
- )
1195
- var(
1196
- --_ctm-mob-dn-ss-ve-sw-cr,
1197
- var(--_ctm-tab-dn-ss-ve-sw-cr, var(--_ctm-dn-ss-ve-sw-cr))
1198
- )
1199
- );
1200
- }
1201
- .code-span {
1202
- background-color: var(
1203
- --_ctm-mob-dn-cy-ce-se-bd-cr,
1204
- var(--_ctm-tab-dn-cy-ce-se-bd-cr, var(--_ctm-dn-cy-ce-se-bd-cr))
1205
- );
1206
- color: var(
1207
- --_ctm-mob-dn-cy-ce-se-cr,
1208
- var(--_ctm-tab-dn-cy-ce-se-cr, var(--_ctm-dn-cy-ce-se-cr))
1209
- );
1210
- font-family: var(
1211
- --_ctm-mob-dn-cy-ce-se-ft-fy,
1212
- var(--_ctm-tab-dn-cy-ce-se-ft-fy, var(--_ctm-dn-cy-ce-se-ft-fy))
1213
- ),
1214
- sans-serif;
1215
- font-size: var(
1216
- --_ctm-mob-dn-cy-ce-se-ft-se,
1217
- var(--_ctm-tab-dn-cy-ce-se-ft-se, var(--_ctm-dn-cy-ce-se-ft-se))
1218
- );
1219
- font-weight: var(
1220
- --_ctm-mob-dn-cy-ce-se-ft-wt,
1221
- var(--_ctm-tab-dn-cy-ce-se-ft-wt, var(--_ctm-dn-cy-ce-se-ft-wt))
1222
- );
1223
- font-style: var(
1224
- --_ctm-mob-dn-cy-ce-se-ft-se-ic,
1225
- var(--_ctm-tab-dn-cy-ce-se-ft-se-ic, var(--_ctm-dn-cy-ce-se-ft-se-ic))
1226
- );
1227
- text-align: var(
1228
- --_ctm-mob-dn-cy-ce-se-tt-an,
1229
- var(--_ctm-tab-dn-cy-ce-se-tt-an, var(--_ctm-dn-cy-ce-se-tt-an))
1230
- );
1231
- letter-spacing: var(
1232
- --_ctm-mob-dn-cy-ce-se-lr-sg,
1233
- var(--_ctm-tab-dn-cy-ce-se-lr-sg, var(--_ctm-dn-cy-ce-se-lr-sg))
1234
- );
1235
- line-height: var(
1236
- --_ctm-mob-dn-cy-ce-se-le-ht,
1237
- var(--_ctm-tab-dn-cy-ce-se-le-ht, var(--_ctm-dn-cy-ce-se-le-ht))
1238
- );
1239
- text-decoration: var(
1240
- --_ctm-mob-dn-cy-ce-se-ue,
1241
- var(--_ctm-tab-dn-cy-ce-se-ue, var(--_ctm-dn-cy-ce-se-ue))
1242
- );
1243
-
1244
- border-color: var(
1245
- --_show-border,
1246
- var(
1247
- --_ctm-mob-dn-cy-ce-se-br-cr,
1248
- var(--_ctm-tab-dn-cy-ce-se-br-cr, var(--_ctm-dn-cy-ce-se-br-cr))
1249
- )
1250
- );
1251
- border-style: var(
1252
- --_show-border,
1253
- var(
1254
- --_ctm-mob-dn-cy-ce-se-br-se,
1255
- var(--_ctm-tab-dn-cy-ce-se-br-se, var(--_ctm-dn-cy-ce-se-br-se))
1256
- )
1257
- );
1258
- border-width: var(
1259
- --_show-border,
1260
- var(
1261
- --_ctm-mob-dn-cy-ce-se-br-wh,
1262
- var(--_ctm-tab-dn-cy-ce-se-br-wh, var(--_ctm-dn-cy-ce-se-br-wh))
1263
- )
1264
- );
1265
- border-radius: var(
1266
- --_ctm-mob-dn-cy-ce-se-br-rs,
1267
- var(--_ctm-tab-dn-cy-ce-se-br-rs, var(--_ctm-dn-cy-ce-se-br-rs))
1268
- );
1269
-
1270
- box-shadow: var(
1271
- --_show-shadow,
1272
- var(
1273
- --_ctm-mob-dn-cy-ce-se-sw-ae,
1274
- var(--_ctm-tab-dn-cy-ce-se-sw-ae, var(--_ctm-dn-cy-ce-se-sw-ae))
1275
- )
1276
- var(
1277
- --_ctm-mob-dn-cy-ce-se-sw-br,
1278
- var(--_ctm-tab-dn-cy-ce-se-sw-br, var(--_ctm-dn-cy-ce-se-sw-br))
1279
- )
1280
- var(
1281
- --_ctm-mob-dn-cy-ce-se-sw-sd,
1282
- var(--_ctm-tab-dn-cy-ce-se-sw-sd, var(--_ctm-dn-cy-ce-se-sw-sd))
1283
- )
1284
- var(
1285
- --_ctm-mob-dn-cy-ce-se-sw-cr,
1286
- var(--_ctm-tab-dn-cy-ce-se-sw-cr, var(--_ctm-dn-cy-ce-se-sw-cr))
1287
- )
1288
- );
1289
- }
766
+ &:focus-within {
767
+ outline: 0 none;
768
+ outline-offset: 0;
769
+ border-radius: 4px;
770
+ box-shadow:
771
+ 0px 1px 2px rgba(16, 24, 40, 0.05),
772
+ 0px 0px 0px 2px var(--_primary-100);
773
+ border: 1px solid var(--_primary-300);
1290
774
  }
1291
775
  }
1292
- .total-price-container {
1293
- .tax-box {
1294
- display: flex;
1295
- align-items: center;
1296
- justify-content: space-between;
1297
- gap: 5px;
1298
-
1299
- background-color: var(
1300
- --_ctm-mob-dn-pt-tx-bd-cr,
1301
- var(--_ctm-tab-dn-pt-tx-bd-cr, var(--_ctm-dn-pt-tx-bd-cr))
1302
- );
1303
- color: var(
1304
- --_ctm-mob-dn-pt-tx-cr,
1305
- var(--_ctm-tab-dn-pt-tx-cr, var(--_ctm-dn-pt-tx-cr))
1306
- );
1307
- font-family: var(
1308
- --_ctm-mob-dn-pt-tx-ft-fy,
1309
- var(--_ctm-tab-dn-pt-tx-ft-fy, var(--_ctm-dn-pt-tx-ft-fy))
1310
- ),
1311
- sans-serif;
1312
- font-size: var(
1313
- --_ctm-mob-dn-pt-tx-ft-se,
1314
- var(--_ctm-tab-dn-pt-tx-ft-se, var(--_ctm-dn-pt-tx-ft-se))
1315
- );
1316
- font-weight: var(
1317
- --_ctm-mob-dn-pt-tx-ft-wt,
1318
- var(--_ctm-tab-dn-pt-tx-ft-wt, var(--_ctm-dn-pt-tx-ft-wt))
1319
- );
1320
- font-style: var(
1321
- --_ctm-mob-dn-pt-tx-ft-se-ic,
1322
- var(--_ctm-tab-dn-pt-tx-ft-se-ic, var(--_ctm-dn-pt-tx-ft-se-ic))
1323
- );
1324
- text-align: var(
1325
- --_ctm-mob-dn-pt-tx-tt-an,
1326
- var(--_ctm-tab-dn-pt-tx-tt-an, var(--_ctm-dn-pt-tx-tt-an))
1327
- );
1328
- letter-spacing: var(
1329
- --_ctm-mob-dn-pt-tx-lr-sg,
1330
- var(--_ctm-tab-dn-pt-tx-lr-sg, var(--_ctm-dn-pt-tx-lr-sg))
1331
- );
1332
- line-height: var(
1333
- --_ctm-mob-dn-pt-tx-le-ht,
1334
- var(--_ctm-tab-dn-pt-tx-le-ht, var(--_ctm-dn-pt-tx-le-ht))
1335
- );
1336
- text-decoration: var(
1337
- --_ctm-mob-dn-pt-tx-ue,
1338
- var(--_ctm-tab-dn-pt-tx-ue, var(--_ctm-dn-pt-tx-ue))
1339
- );
1340
-
1341
- border-color: var(
1342
- --_show-border,
1343
- var(
1344
- --_ctm-mob-dn-pt-tx-br-cr,
1345
- var(--_ctm-tab-dn-pt-tx-br-cr, var(--_ctm-dn-pt-tx-br-cr))
1346
- )
1347
- );
1348
- border-style: var(
1349
- --_show-border,
1350
- var(
1351
- --_ctm-mob-dn-pt-tx-br-se,
1352
- var(--_ctm-tab-dn-pt-tx-br-se, var(--_ctm-dn-pt-tx-br-se))
1353
- )
1354
- );
1355
- border-width: var(
1356
- --_show-border,
1357
- var(
1358
- --_ctm-mob-dn-pt-tx-br-wh,
1359
- var(--_ctm-tab-dn-pt-tx-br-wh, var(--_ctm-dn-pt-tx-br-wh))
1360
- )
1361
- );
1362
- border-radius: var(
1363
- --_ctm-mob-dn-pt-tx-br-rs,
1364
- var(--_ctm-tab-dn-pt-tx-br-rs, var(--_ctm-dn-pt-tx-br-rs))
1365
- );
1366
-
1367
- box-shadow: var(
1368
- --_show-shadow,
1369
- var(
1370
- --_ctm-mob-dn-pt-tx-sw-ae,
1371
- var(--_ctm-tab-dn-pt-tx-sw-ae, var(--_ctm-dn-pt-tx-sw-ae))
1372
- )
1373
- var(
1374
- --_ctm-mob-dn-pt-tx-sw-br,
1375
- var(--_ctm-tab-dn-pt-tx-sw-br, var(--_ctm-dn-pt-tx-sw-br))
1376
- )
1377
- var(
1378
- --_ctm-mob-dn-pt-tx-sw-sd,
1379
- var(--_ctm-tab-dn-pt-tx-sw-sd, var(--_ctm-dn-pt-tx-sw-sd))
1380
- )
1381
- var(
1382
- --_ctm-mob-dn-pt-tx-sw-cr,
1383
- var(--_ctm-tab-dn-pt-tx-sw-cr, var(--_ctm-dn-pt-tx-sw-cr))
1384
- )
1385
- );
1386
- }
1387
- .shipping-box {
1388
- display: flex;
1389
- align-items: center;
1390
- justify-content: space-between;
1391
- gap: 5px;
1392
-
1393
- background-color: var(
1394
- --_ctm-mob-dn-pt-sg-pe-bd-cr,
1395
- var(--_ctm-tab-dn-pt-sg-pe-bd-cr, var(--_ctm-dn-pt-sg-pe-bd-cr))
1396
- );
1397
- color: var(
1398
- --_ctm-mob-dn-pt-sg-pe-cr,
1399
- var(--_ctm-tab-dn-pt-sg-pe-cr, var(--_ctm-dn-pt-sg-pe-cr))
1400
- );
1401
- font-family: var(
1402
- --_ctm-mob-dn-pt-sg-pe-ft-fy,
1403
- var(--_ctm-tab-dn-pt-sg-pe-ft-fy, var(--_ctm-dn-pt-sg-pe-ft-fy))
1404
- ),
1405
- sans-serif;
1406
- font-size: var(
1407
- --_ctm-mob-dn-pt-sg-pe-ft-se,
1408
- var(--_ctm-tab-dn-pt-sg-pe-ft-se, var(--_ctm-dn-pt-sg-pe-ft-se))
1409
- );
1410
- font-weight: var(
1411
- --_ctm-mob-dn-pt-sg-pe-ft-wt,
1412
- var(--_ctm-tab-dn-pt-sg-pe-ft-wt, var(--_ctm-dn-pt-sg-pe-ft-wt))
1413
- );
1414
- font-style: var(
1415
- --_ctm-mob-dn-pt-sg-pe-ft-se-ic,
1416
- var(--_ctm-tab-dn-pt-sg-pe-ft-se-ic, var(--_ctm-dn-pt-sg-pe-ft-se-ic))
1417
- );
1418
- text-align: var(
1419
- --_ctm-mob-dn-pt-sg-pe-tt-an,
1420
- var(--_ctm-tab-dn-pt-sg-pe-tt-an, var(--_ctm-dn-pt-sg-pe-tt-an))
1421
- );
1422
- letter-spacing: var(
1423
- --_ctm-mob-dn-pt-sg-pe-lr-sg,
1424
- var(--_ctm-tab-dn-pt-sg-pe-lr-sg, var(--_ctm-dn-pt-sg-pe-lr-sg))
1425
- );
1426
- line-height: var(
1427
- --_ctm-mob-dn-pt-sg-pe-le-ht,
1428
- var(--_ctm-tab-dn-pt-sg-pe-le-ht, var(--_ctm-dn-pt-sg-pe-le-ht))
1429
- );
1430
- text-decoration: var(
1431
- --_ctm-mob-dn-pt-sg-pe-ue,
1432
- var(--_ctm-tab-dn-pt-sg-pe-ue, var(--_ctm-dn-pt-sg-pe-ue))
1433
- );
1434
-
1435
- border-color: var(
1436
- --_show-border,
1437
- var(
1438
- --_ctm-mob-dn-pt-sg-pe-br-cr,
1439
- var(--_ctm-tab-dn-pt-sg-pe-br-cr, var(--_ctm-dn-pt-sg-pe-br-cr))
1440
- )
1441
- );
1442
- border-style: var(
1443
- --_show-border,
1444
- var(
1445
- --_ctm-mob-dn-pt-sg-pe-br-se,
1446
- var(--_ctm-tab-dn-pt-sg-pe-br-se, var(--_ctm-dn-pt-sg-pe-br-se))
1447
- )
1448
- );
1449
- border-width: var(
1450
- --_show-border,
1451
- var(
1452
- --_ctm-mob-dn-pt-sg-pe-br-wh,
1453
- var(--_ctm-tab-dn-pt-sg-pe-br-wh, var(--_ctm-dn-pt-sg-pe-br-wh))
1454
- )
1455
- );
1456
- border-radius: var(
1457
- --_ctm-mob-dn-pt-sg-pe-br-rs,
1458
- var(--_ctm-tab-dn-pt-sg-pe-br-rs, var(--_ctm-dn-pt-sg-pe-br-rs))
1459
- );
776
+ }
777
+ .delivery_details_container {
778
+ display: flex;
779
+ flex-direction: column;
780
+ gap: var(
781
+ --_ctm-mob-dn-gt-cd-cd-wr-im-gp,
782
+ var(--_ctm-tab-dn-gt-cd-cd-wr-im-gp, var(--_ctm-dn-gt-cd-cd-wr-im-gp))
783
+ );
784
+ .delivery_details_title {
785
+ display: inline-block;
786
+ // margin-top: 8px;
787
+ // margin-bottom: 4px;
788
+ // font-size: 16px;
789
+ // color: #000000;
790
+ // font-weight: 500;
791
+ // line-height: 150%;
792
+ font-family: var(
793
+ --_ctm-mob-dn-gt-cd-ts-ft-fy,
794
+ var(--_ctm-tab-dn-gt-cd-ts-ft-fy, var(--_ctm-dn-gt-cd-ts-ft-fy))
795
+ );
796
+ color: var(
797
+ --_ctm-mob-dn-gt-cd-ts-cr,
798
+ var(--_ctm-tab-dn-gt-cd-ts-cr, var(--_ctm-dn-gt-cd-ts-cr))
799
+ );
800
+ font-weight: var(
801
+ --_ctm-mob-dn-gt-cd-ts-ft-wt,
802
+ var(--_ctm-tab-dn-gt-cd-ts-ft-wt, var(--_ctm-dn-gt-cd-ts-ft-wt))
803
+ );
804
+ font-size: var(
805
+ --_ctm-mob-dn-gt-cd-ts-ft-se,
806
+ var(--_ctm-tab-dn-gt-cd-ts-ft-se, var(--_ctm-dn-gt-cd-ts-ft-se))
807
+ );
808
+ text-decoration: var(
809
+ --_ctm-mob-dn-gt-cd-ts-ue,
810
+ var(--_ctm-tab-dn-gt-cd-ts-ue, var(--_ctm-dn-gt-cd-ts-ue))
811
+ );
812
+ letter-spacing: var(
813
+ --_ctm-mob-dn-gt-cd-ts-lr-sg,
814
+ var(--_ctm-tab-dn-gt-cd-ts-lr-sg, var(--_ctm-dn-gt-cd-ts-lr-sg))
815
+ );
816
+ line-height: var(
817
+ --_ctm-mob-dn-gt-cd-ts-le-ht,
818
+ var(--_ctm-tab-dn-gt-cd-ts-le-ht, var(--_ctm-dn-gt-cd-ts-le-ht))
819
+ );
820
+ font-style: var(
821
+ --_ctm-mob-dn-gt-cd-ts-ft-se-ic,
822
+ var(--_ctm-tab-dn-gt-cd-ts-ft-se-ic, var(--_ctm-dn-gt-cd-ts-ft-se-ic))
823
+ );
824
+ text-align: var(
825
+ --_ctm-mob-dn-gt-cd-ts-tt-an,
826
+ var(--_ctm-tab-dn-gt-cd-ts-tt-an, var(--_ctm-dn-gt-cd-ts-tt-an))
827
+ );
828
+ }
829
+ .horizontal_line {
830
+ // border: 1px solid #d0d5dd;
831
+ // display: block;
832
+ // width: 100%;
833
+ // border-style: var(--_ctm-dn-gt-cd-dr-dr-se);
834
+ // border-color: var(--_ctm-dn-gt-cd-dr-dr-cr);
835
+ // border-width: var(--_ctm-dn-gt-cd-dr-dr-wh);
836
+ border-top: var(--_ctm-dn-gt-cd-dr-dr-wh) var(--_ctm-dn-gt-cd-dr-dr-se)
837
+ var(--_ctm-dn-gt-cd-dr-dr-cr);
838
+ }
839
+ .input_container {
840
+ display: flex;
841
+ flex-direction: column;
842
+ gap: 8px;
843
+ // margin-bottom: 12px;
1460
844
 
1461
- box-shadow: var(
1462
- --_show-shadow,
1463
- var(
1464
- --_ctm-mob-dn-pt-sg-pe-sw-ae,
1465
- var(--_ctm-tab-dn-pt-sg-pe-sw-ae, var(--_ctm-dn-pt-sg-pe-sw-ae))
1466
- )
1467
- var(
1468
- --_ctm-mob-dn-pt-sg-pe-sw-br,
1469
- var(--_ctm-tab-dn-pt-sg-pe-sw-br, var(--_ctm-dn-pt-sg-pe-sw-br))
1470
- )
1471
- var(
1472
- --_ctm-mob-dn-pt-sg-pe-sw-sd,
1473
- var(--_ctm-tab-dn-pt-sg-pe-sw-sd, var(--_ctm-dn-pt-sg-pe-sw-sd))
1474
- )
1475
- var(
1476
- --_ctm-mob-dn-pt-sg-pe-sw-cr,
1477
- var(--_ctm-tab-dn-pt-sg-pe-sw-cr, var(--_ctm-dn-pt-sg-pe-sw-cr))
1478
- )
1479
- );
845
+ &:last-child {
846
+ margin-bottom: 0;
1480
847
  }
1481
- .embellishment-box {
1482
- display: flex;
1483
- align-items: center;
1484
- justify-content: space-between;
1485
- gap: 5px;
1486
-
1487
- background-color: var(
1488
- --_ctm-mob-dn-et-pe-bd-cr,
1489
- var(--_ctm-tab-dn-et-pe-bd-cr, var(--_ctm-dn-et-pe-bd-cr))
1490
- );
1491
- color: var(
1492
- --_ctm-mob-dn-et-pe-cr,
1493
- var(--_ctm-tab-dn-et-pe-cr, var(--_ctm-dn-et-pe-cr))
1494
- );
848
+ label {
849
+ display: block;
1495
850
  font-family: var(
1496
- --_ctm-mob-dn-et-pe-ft-fy,
1497
- var(--_ctm-tab-dn-et-pe-ft-fy, var(--_ctm-dn-et-pe-ft-fy))
1498
- ),
1499
- sans-serif;
1500
- font-size: var(
1501
- --_ctm-mob-dn-et-pe-ft-se,
1502
- var(--_ctm-tab-dn-et-pe-ft-se, var(--_ctm-dn-et-pe-ft-se))
851
+ --_ctm-mob-dn-gt-cd-ls-ft-fy,
852
+ var(--_ctm-tab-dn-gt-cd-ls-ft-fy, var(--_ctm-dn-gt-cd-ls-ft-fy))
853
+ );
854
+ color: var(
855
+ --_ctm-mob-dn-gt-cd-ls-cr,
856
+ var(--_ctm-tab-dn-gt-cd-ls-cr, var(--_ctm-dn-gt-cd-ls-cr))
1503
857
  );
1504
858
  font-weight: var(
1505
- --_ctm-mob-dn-et-pe-ft-wt,
1506
- var(--_ctm-tab-dn-et-pe-ft-wt, var(--_ctm-dn-et-pe-ft-wt))
859
+ --_ctm-mob-dn-gt-cd-ls-ft-wt,
860
+ var(--_ctm-tab-dn-gt-cd-ls-ft-wt, var(--_ctm-dn-gt-cd-ls-ft-wt))
1507
861
  );
1508
- font-style: var(
1509
- --_ctm-mob-dn-et-pe-ft-se-ic,
1510
- var(--_ctm-tab-dn-et-pe-ft-se-ic, var(--_ctm-dn-et-pe-ft-se-ic))
862
+ font-size: var(
863
+ --_ctm-mob-dn-gt-cd-ls-ft-se,
864
+ var(--_ctm-tab-dn-gt-cd-ls-ft-se, var(--_ctm-dn-gt-cd-ls-ft-se))
1511
865
  );
1512
- text-align: var(
1513
- --_ctm-mob-dn-et-pe-tt-an,
1514
- var(--_ctm-tab-dn-et-pe-tt-an, var(--_ctm-dn-et-pe-tt-an))
866
+ text-decoration: var(
867
+ --_ctm-mob-dn-gt-cd-ls-ue,
868
+ var(--_ctm-tab-dn-gt-cd-ls-ue, var(--_ctm-dn-gt-cd-ls-ue))
1515
869
  );
1516
870
  letter-spacing: var(
1517
- --_ctm-mob-dn-et-pe-lr-sg,
1518
- var(--_ctm-tab-dn-et-pe-lr-sg, var(--_ctm-dn-et-pe-lr-sg))
871
+ --_ctm-mob-dn-gt-cd-ls-lr-sg,
872
+ var(--_ctm-tab-dn-gt-cd-ls-lr-sg, var(--_ctm-dn-gt-cd-ls-lr-sg))
1519
873
  );
1520
874
  line-height: var(
1521
- --_ctm-mob-dn-et-pe-le-ht,
1522
- var(--_ctm-tab-dn-et-pe-le-ht, var(--_ctm-dn-et-pe-le-ht))
875
+ --_ctm-mob-dn-gt-cd-ls-le-ht,
876
+ var(--_ctm-tab-dn-gt-cd-ls-le-ht, var(--_ctm-dn-gt-cd-ls-le-ht))
1523
877
  );
1524
- text-decoration: var(
1525
- --_ctm-mob-dn-et-pe-ue,
1526
- var(--_ctm-tab-dn-et-pe-ue, var(--_ctm-dn-et-pe-ue))
878
+ font-style: var(
879
+ --_ctm-mob-dn-gt-cd-ls-ft-se-ic,
880
+ var(--_ctm-tab-dn-gt-cd-ls-ft-se-ic, var(--_ctm-dn-gt-cd-ls-ft-se-ic))
881
+ );
882
+ text-align: var(
883
+ --_ctm-mob-dn-gt-cd-ls-tt-an,
884
+ var(--_ctm-tab-dn-gt-cd-ls-tt-an, var(--_ctm-dn-gt-cd-ls-tt-an))
885
+ );
886
+ padding: var(
887
+ --_ctm-mob-dn-gt-cd-ls-pg,
888
+ var(--_ctm-tab-dn-gt-cd-ls-pg, var(--_ctm-dn-gt-cd-ls-pg))
889
+ );
890
+ // color: var(--_gray-700);
891
+ // font-weight: 400;
892
+ // font-size: 14px;
893
+ // line-height: 20px;
894
+ }
895
+ .message_text {
896
+ resize: none;
897
+ // background-color: var(--_base-white);
898
+ // padding: 5px 12px;
899
+ // border: 1px solid var(--_gray-300);
900
+ // border-radius: 4px;
901
+ background-color: var(
902
+ --_ctm-mob-dn-gt-cd-is-bd-cr,
903
+ var(--_ctm-tab-dn-gt-cd-is-bd-cr, var(--_ctm-dn-gt-cd-is-bd-cr))
1527
904
  );
1528
905
 
1529
906
  border-color: var(
1530
- --_show-border,
1531
- var(
1532
- --_ctm-mob-dn-et-pe-br-cr,
1533
- var(--_ctm-tab-dn-et-pe-br-cr, var(--_ctm-dn-et-pe-br-cr))
1534
- )
907
+ --_ctm-mob-dn-gt-cd-is-br-cr,
908
+ var(--_ctm-tab-dn-gt-cd-is-br-cr, var(--_ctm-dn-gt-cd-is-br-cr))
909
+ );
910
+ border-radius: var(
911
+ --_ctm-mob-dn-gt-cd-is-br-rs,
912
+ var(--_ctm-tab-dn-gt-cd-is-br-rs, var(--_ctm-dn-gt-cd-is-br-rs))
1535
913
  );
1536
914
  border-style: var(
1537
- --_show-border,
1538
- var(
1539
- --_ctm-mob-dn-et-pe-br-se,
1540
- var(--_ctm-tab-dn-et-pe-br-se, var(--_ctm-dn-et-pe-br-se))
1541
- )
915
+ --_ctm-mob-dn-gt-cd-is-br-se,
916
+ var(--_ctm-tab-dn-gt-cd-is-br-se, var(--_ctm-dn-gt-cd-is-br-se))
1542
917
  );
1543
918
  border-width: var(
1544
- --_show-border,
1545
- var(
1546
- --_ctm-mob-dn-et-pe-br-wh,
1547
- var(--_ctm-tab-dn-et-pe-br-wh, var(--_ctm-dn-et-pe-br-wh))
1548
- )
919
+ --_ctm-mob-dn-gt-cd-is-br-wh,
920
+ var(--_ctm-tab-dn-gt-cd-is-br-wh, var(--_ctm-dn-gt-cd-is-br-wh))
921
+ );
922
+ padding: var(
923
+ --_ctm-mob-dn-gt-cd-is-pg,
924
+ var(--_ctm-tab-dn-gt-cd-is-pg, var(--_ctm-dn-gt-cd-is-pg))
925
+ );
926
+ // margin-bottom: 8px;
927
+ transition:
928
+ background-color 0.2s,
929
+ color 0.2s,
930
+ border-color 0.2s,
931
+ box-shadow 0.2s;
932
+ height: 90px;
933
+ &::placeholder {
934
+ // color: var(--_gray-500);
935
+ // font-weight: 500;
936
+ // font-size: 14px;
937
+ // line-height: 24px;
938
+ font-family: var(
939
+ --_ctm-mob-dn-gt-cd-is-ft-fy,
940
+ var(--_ctm-tab-dn-gt-cd-is-ft-fy, var(--_ctm-dn-gt-cd-is-ft-fy))
941
+ );
942
+ color: var(
943
+ --_ctm-mob-dn-gt-cd-is-cr,
944
+ var(--_ctm-tab-dn-gt-cd-is-cr, var(--_ctm-dn-gt-cd-is-cr))
945
+ );
946
+ font-weight: var(
947
+ --_ctm-mob-dn-gt-cd-is-ft-wt,
948
+ var(--_ctm-tab-dn-gt-cd-is-ft-wt, var(--_ctm-dn-gt-cd-is-ft-wt))
949
+ );
950
+ font-size: var(
951
+ --_ctm-mob-dn-gt-cd-is-ft-se,
952
+ var(--_ctm-tab-dn-gt-cd-is-ft-se, var(--_ctm-dn-gt-cd-is-ft-se))
953
+ );
954
+ text-decoration: var(
955
+ --_ctm-mob-dn-gt-cd-is-ue,
956
+ var(--_ctm-tab-dn-gt-cd-is-ue, var(--_ctm-dn-gt-cd-is-ue))
957
+ );
958
+ letter-spacing: var(
959
+ --_ctm-mob-dn-gt-cd-is-lr-sg,
960
+ var(--_ctm-tab-dn-gt-cd-is-lr-sg, var(--_ctm-dn-gt-cd-is-lr-sg))
961
+ );
962
+ line-height: var(
963
+ --_ctm-mob-dn-gt-cd-is-le-ht,
964
+ var(--_ctm-tab-dn-gt-cd-is-le-ht, var(--_ctm-dn-gt-cd-is-le-ht))
965
+ );
966
+ font-style: var(
967
+ --_ctm-mob-dn-gt-cd-is-ft-se-ic,
968
+ var(--_ctm-tab-dn-gt-cd-is-ft-se-ic, var(--_ctm-dn-gt-cd-is-ft-se-ic))
969
+ );
970
+ text-align: var(
971
+ --_ctm-mob-dn-gt-cd-is-tt-an,
972
+ var(--_ctm-tab-dn-gt-cd-is-tt-an, var(--_ctm-dn-gt-cd-is-tt-an))
973
+ );
974
+ }
975
+ &:focus {
976
+ outline: 0 none;
977
+ outline-offset: 0;
978
+ border-radius: 4px;
979
+ box-shadow:
980
+ 0px 1px 2px rgba(16, 24, 40, 0.05),
981
+ 0px 0px 0px 2px var(--_primary-100);
982
+ border: 1px solid var(--_primary-300);
983
+ }
984
+ }
985
+ input {
986
+ // background-color: var(--_base-white);
987
+ // padding: 8px 12px;
988
+ // border: 1px solid var(--_gray-300);
989
+ // border-radius: 4px;
990
+ height: 40px;
991
+
992
+ background-color: var(
993
+ --_ctm-mob-dn-gt-cd-is-bd-cr,
994
+ var(--_ctm-tab-dn-gt-cd-is-bd-cr, var(--_ctm-dn-gt-cd-is-bd-cr))
995
+ );
996
+
997
+ border-color: var(
998
+ --_ctm-mob-dn-gt-cd-is-br-cr,
999
+ var(--_ctm-tab-dn-gt-cd-is-br-cr, var(--_ctm-dn-gt-cd-is-br-cr))
1549
1000
  );
1550
1001
  border-radius: var(
1551
- --_ctm-mob-dn-et-pe-br-rs,
1552
- var(--_ctm-tab-dn-et-pe-br-rs, var(--_ctm-dn-et-pe-br-rs))
1002
+ --_ctm-mob-dn-gt-cd-is-br-rs,
1003
+ var(--_ctm-tab-dn-gt-cd-is-br-rs, var(--_ctm-dn-gt-cd-is-br-rs))
1553
1004
  );
1554
-
1555
- box-shadow: var(
1556
- --_show-shadow,
1557
- var(
1558
- --_ctm-mob-dn-et-pe-sw-ae,
1559
- var(--_ctm-tab-dn-et-pe-sw-ae, var(--_ctm-dn-et-pe-sw-ae))
1560
- )
1561
- var(
1562
- --_ctm-mob-dn-et-pe-sw-br,
1563
- var(--_ctm-tab-dn-et-pe-sw-br, var(--_ctm-dn-et-pe-sw-br))
1564
- )
1565
- var(
1566
- --_ctm-mob-dn-et-pe-sw-sd,
1567
- var(--_ctm-tab-dn-et-pe-sw-sd, var(--_ctm-dn-et-pe-sw-sd))
1568
- )
1569
- var(
1570
- --_ctm-mob-dn-et-pe-sw-cr,
1571
- var(--_ctm-tab-dn-et-pe-sw-cr, var(--_ctm-dn-et-pe-sw-cr))
1572
- )
1005
+ border-style: var(
1006
+ --_ctm-mob-dn-gt-cd-is-br-se,
1007
+ var(--_ctm-tab-dn-gt-cd-is-br-se, var(--_ctm-dn-gt-cd-is-br-se))
1573
1008
  );
1009
+ border-width: var(
1010
+ --_ctm-mob-dn-gt-cd-is-br-wh,
1011
+ var(--_ctm-tab-dn-gt-cd-is-br-wh, var(--_ctm-dn-gt-cd-is-br-wh))
1012
+ );
1013
+ padding: var(
1014
+ --_ctm-mob-dn-gt-cd-is-pg,
1015
+ var(--_ctm-tab-dn-gt-cd-is-pg, var(--_ctm-dn-gt-cd-is-pg))
1016
+ );
1017
+
1018
+ transition:
1019
+ background-color 0.2s,
1020
+ color 0.2s,
1021
+ border-color 0.2s,
1022
+ box-shadow 0.2s;
1023
+ &::placeholder {
1024
+ // color: var(--_gray-500);
1025
+ // font-weight: 500;
1026
+ // font-size: 14px;
1027
+ // line-height: 24px;
1028
+ font-family: var(
1029
+ --_ctm-mob-dn-gt-cd-is-ft-fy,
1030
+ var(--_ctm-tab-dn-gt-cd-is-ft-fy, var(--_ctm-dn-gt-cd-is-ft-fy))
1031
+ );
1032
+ color: var(
1033
+ --_ctm-mob-dn-gt-cd-is-cr,
1034
+ var(--_ctm-tab-dn-gt-cd-is-cr, var(--_ctm-dn-gt-cd-is-cr))
1035
+ );
1036
+ font-weight: var(
1037
+ --_ctm-mob-dn-gt-cd-is-ft-wt,
1038
+ var(--_ctm-tab-dn-gt-cd-is-ft-wt, var(--_ctm-dn-gt-cd-is-ft-wt))
1039
+ );
1040
+ font-size: var(
1041
+ --_ctm-mob-dn-gt-cd-is-ft-se,
1042
+ var(--_ctm-tab-dn-gt-cd-is-ft-se, var(--_ctm-dn-gt-cd-is-ft-se))
1043
+ );
1044
+ text-decoration: var(
1045
+ --_ctm-mob-dn-gt-cd-is-ue,
1046
+ var(--_ctm-tab-dn-gt-cd-is-ue, var(--_ctm-dn-gt-cd-is-ue))
1047
+ );
1048
+ letter-spacing: var(
1049
+ --_ctm-mob-dn-gt-cd-is-lr-sg,
1050
+ var(--_ctm-tab-dn-gt-cd-is-lr-sg, var(--_ctm-dn-gt-cd-is-lr-sg))
1051
+ );
1052
+ line-height: var(
1053
+ --_ctm-mob-dn-gt-cd-is-le-ht,
1054
+ var(--_ctm-tab-dn-gt-cd-is-le-ht, var(--_ctm-dn-gt-cd-is-le-ht))
1055
+ );
1056
+ font-style: var(
1057
+ --_ctm-mob-dn-gt-cd-is-ft-se-ic,
1058
+ var(--_ctm-tab-dn-gt-cd-is-ft-se-ic, var(--_ctm-dn-gt-cd-is-ft-se-ic))
1059
+ );
1060
+ text-align: var(
1061
+ --_ctm-mob-dn-gt-cd-is-tt-an,
1062
+ var(--_ctm-tab-dn-gt-cd-is-tt-an, var(--_ctm-dn-gt-cd-is-tt-an))
1063
+ );
1064
+ }
1065
+ &:focus {
1066
+ outline: 0 none;
1067
+ outline-offset: 0;
1068
+ border-radius: 4px;
1069
+ box-shadow:
1070
+ 0px 1px 2px rgba(16, 24, 40, 0.05),
1071
+ 0px 0px 0px 2px var(--_primary-100);
1072
+ border: 1px solid var(--_primary-300);
1073
+ }
1074
+ }
1075
+ .error_text {
1076
+ font-size: 12px;
1077
+ color: var(--_error-500);
1574
1078
  }
1575
1079
  }
1576
1080
  }
1081
+ }
1082
+ }
1083
+ .product-actual-price-container {
1084
+ .product-actual-discount {
1085
+ .discount-percentage {
1086
+ background-color: var(
1087
+ --_ctm-mob-dn-dt-bd-cr,
1088
+ var(--_ctm-tab-dn-dt-bd-cr, var(--_ctm-dn-dt-bd-cr))
1089
+ );
1090
+ color: var(--_ctm-mob-dn-dt-cr, var(--_ctm-tab-dn-dt-cr, var(--_ctm-dn-dt-cr)));
1091
+ font-family:
1092
+ var(--_ctm-mob-dn-dt-ft-fy, var(--_ctm-tab-dn-dt-ft-fy, var(--_ctm-dn-dt-ft-fy))),
1093
+ sans-serif;
1094
+ font-size: var(
1095
+ --_ctm-mob-dn-dt-ft-se,
1096
+ var(--_ctm-tab-dn-dt-ft-se, var(--_ctm-dn-dt-ft-se))
1097
+ );
1098
+ font-weight: var(
1099
+ --_ctm-mob-dn-dt-ft-wt,
1100
+ var(--_ctm-tab-dn-dt-ft-wt, var(--_ctm-dn-dt-ft-wt))
1101
+ );
1102
+ font-style: var(
1103
+ --_ctm-mob-dn-dt-ft-se-ic,
1104
+ var(--_ctm-tab-dn-dt-ft-se-ic, var(--_ctm-dn-dt-ft-se-ic))
1105
+ );
1106
+ text-align: var(
1107
+ --_ctm-mob-dn-dt-tt-an,
1108
+ var(--_ctm-tab-dn-dt-tt-an, var(--_ctm-dn-dt-tt-an))
1109
+ );
1110
+ letter-spacing: var(
1111
+ --_ctm-mob-dn-dt-lr-sg,
1112
+ var(--_ctm-tab-dn-dt-lr-sg, var(--_ctm-dn-dt-lr-sg))
1113
+ );
1114
+ line-height: var(
1115
+ --_ctm-mob-dn-dt-le-ht,
1116
+ var(--_ctm-tab-dn-dt-le-ht, var(--_ctm-dn-dt-le-ht))
1117
+ );
1118
+ text-decoration: var(--_ctm-mob-dn-dt-ue, var(--_ctm-tab-dn-dt-ue, var(--_ctm-dn-dt-ue)));
1119
+
1120
+ border-color: var(
1121
+ --_show-border,
1122
+ var(--_ctm-mob-dn-dt-br-cr, var(--_ctm-tab-dn-dt-br-cr, var(--_ctm-dn-dt-br-cr)))
1123
+ );
1124
+ border-style: var(
1125
+ --_show-border,
1126
+ var(--_ctm-mob-dn-dt-br-se, var(--_ctm-tab-dn-dt-br-se, var(--_ctm-dn-dt-br-se)))
1127
+ );
1128
+ border-width: var(
1129
+ --_show-border,
1130
+ var(--_ctm-mob-dn-dt-br-wh, var(--_ctm-tab-dn-dt-br-wh, var(--_ctm-dn-dt-br-wh)))
1131
+ );
1132
+ border-radius: var(
1133
+ --_ctm-mob-dn-dt-br-rs,
1134
+ var(--_ctm-tab-dn-dt-br-rs, var(--_ctm-dn-dt-br-rs))
1135
+ );
1136
+
1137
+ box-shadow: var(
1138
+ --_show-shadow,
1139
+ var(--_ctm-mob-dn-dt-sw-ae, var(--_ctm-tab-dn-dt-sw-ae, var(--_ctm-dn-dt-sw-ae)))
1140
+ var(--_ctm-mob-dn-dt-sw-br, var(--_ctm-tab-dn-dt-sw-br, var(--_ctm-dn-dt-sw-br)))
1141
+ var(--_ctm-mob-dn-dt-sw-sd, var(--_ctm-tab-dn-dt-sw-sd, var(--_ctm-dn-dt-sw-sd)))
1142
+ var(--_ctm-mob-dn-dt-sw-cr, var(--_ctm-tab-dn-dt-sw-cr, var(--_ctm-dn-dt-sw-cr)))
1143
+ );
1144
+ }
1145
+
1146
+ .discount-value-percentage {
1147
+ background-color: var(
1148
+ --_ctm-mob-dn-dt-ve-bd-cr,
1149
+ var(--_ctm-tab-dn-dt-ve-bd-cr, var(--_ctm-dn-dt-ve-bd-cr))
1150
+ );
1151
+ color: var(--_ctm-mob-dn-dt-ve-cr, var(--_ctm-tab-dn-dt-ve-cr, var(--_ctm-dn-dt-ve-cr)));
1152
+ font-family:
1153
+ var(
1154
+ --_ctm-mob-dn-dt-ve-ft-fy,
1155
+ var(--_ctm-tab-dn-dt-ve-ft-fy, var(--_ctm-dn-dt-ve-ft-fy))
1156
+ ),
1157
+ sans-serif;
1158
+ font-size: var(
1159
+ --_ctm-mob-dn-dt-ve-ft-se,
1160
+ var(--_ctm-tab-dn-dt-ve-ft-se, var(--_ctm-dn-dt-ve-ft-se))
1161
+ );
1162
+ font-weight: var(
1163
+ --_ctm-mob-dn-dt-ve-ft-wt,
1164
+ var(--_ctm-tab-dn-dt-ve-ft-wt, var(--_ctm-dn-dt-ve-ft-wt))
1165
+ );
1166
+ font-style: var(
1167
+ --_ctm-mob-dn-dt-ve-ft-se-ic,
1168
+ var(--_ctm-tab-dn-dt-ve-ft-se-ic, var(--_ctm-dn-dt-ve-ft-se-ic))
1169
+ );
1170
+ text-align: var(
1171
+ --_ctm-mob-dn-dt-ve-tt-an,
1172
+ var(--_ctm-tab-dn-dt-ve-tt-an, var(--_ctm-dn-dt-ve-tt-an))
1173
+ );
1174
+ letter-spacing: var(
1175
+ --_ctm-mob-dn-dt-ve-lr-sg,
1176
+ var(--_ctm-tab-dn-dt-ve-lr-sg, var(--_ctm-dn-dt-ve-lr-sg))
1177
+ );
1178
+ line-height: var(
1179
+ --_ctm-mob-dn-dt-ve-le-ht,
1180
+ var(--_ctm-tab-dn-dt-ve-le-ht, var(--_ctm-dn-dt-ve-le-ht))
1181
+ );
1182
+ text-decoration: var(
1183
+ --_ctm-mob-dn-dt-ve-ue,
1184
+ var(--_ctm-tab-dn-dt-ve-ue, var(--_ctm-dn-dt-ve-ue))
1185
+ );
1186
+
1187
+ border-color: var(
1188
+ --_show-border,
1189
+ var(
1190
+ --_ctm-mob-dn-dt-ve-br-cr,
1191
+ var(--_ctm-tab-dn-dt-ve-br-cr, var(--_ctm-dn-dt-ve-br-cr))
1192
+ )
1193
+ );
1194
+ border-style: var(
1195
+ --_show-border,
1196
+ var(
1197
+ --_ctm-mob-dn-dt-ve-br-se,
1198
+ var(--_ctm-tab-dn-dt-ve-br-se, var(--_ctm-dn-dt-ve-br-se))
1199
+ )
1200
+ );
1201
+ border-width: var(
1202
+ --_show-border,
1203
+ var(
1204
+ --_ctm-mob-dn-dt-ve-br-wh,
1205
+ var(--_ctm-tab-dn-dt-ve-br-wh, var(--_ctm-dn-dt-ve-br-wh))
1206
+ )
1207
+ );
1208
+ border-radius: var(
1209
+ --_ctm-mob-dn-dt-ve-br-rs,
1210
+ var(--_ctm-tab-dn-dt-ve-br-rs, var(--_ctm-dn-dt-ve-br-rs))
1211
+ );
1212
+
1213
+ box-shadow: var(
1214
+ --_show-shadow,
1215
+ var(
1216
+ --_ctm-mob-dn-dt-ve-sw-ae,
1217
+ var(--_ctm-tab-dn-dt-ve-sw-ae, var(--_ctm-dn-dt-ve-sw-ae))
1218
+ )
1219
+ var(
1220
+ --_ctm-mob-dn-dt-ve-sw-br,
1221
+ var(--_ctm-tab-dn-dt-ve-sw-br, var(--_ctm-dn-dt-ve-sw-br))
1222
+ )
1223
+ var(
1224
+ --_ctm-mob-dn-dt-ve-sw-sd,
1225
+ var(--_ctm-tab-dn-dt-ve-sw-sd, var(--_ctm-dn-dt-ve-sw-sd))
1226
+ )
1227
+ var(
1228
+ --_ctm-mob-dn-dt-ve-sw-cr,
1229
+ var(--_ctm-tab-dn-dt-ve-sw-cr, var(--_ctm-dn-dt-ve-sw-cr))
1230
+ )
1231
+ );
1232
+ }
1233
+ }
1234
+ .product-actual-price {
1235
+ .actual-price-span {
1236
+ background-color: var(
1237
+ --_ctm-mob-dn-al-pe-bd-cr,
1238
+ var(--_ctm-tab-dn-al-pe-bd-cr, var(--_ctm-dn-al-pe-bd-cr))
1239
+ );
1240
+ color: var(--_ctm-mob-dn-al-pe-cr, var(--_ctm-tab-dn-al-pe-cr, var(--_ctm-dn-al-pe-cr)));
1241
+ font-family:
1242
+ var(
1243
+ --_ctm-mob-dn-al-pe-ft-fy,
1244
+ var(--_ctm-tab-dn-al-pe-ft-fy, var(--_ctm-dn-al-pe-ft-fy))
1245
+ ),
1246
+ sans-serif;
1247
+ font-size: var(
1248
+ --_ctm-mob-dn-al-pe-ft-se,
1249
+ var(--_ctm-tab-dn-al-pe-ft-se, var(--_ctm-dn-al-pe-ft-se))
1250
+ );
1251
+ font-weight: var(
1252
+ --_ctm-mob-dn-al-pe-ft-wt,
1253
+ var(--_ctm-tab-dn-al-pe-ft-wt, var(--_ctm-dn-al-pe-ft-wt))
1254
+ );
1255
+ font-style: var(
1256
+ --_ctm-mob-dn-al-pe-ft-se-ic,
1257
+ var(--_ctm-tab-dn-al-pe-ft-se-ic, var(--_ctm-dn-al-pe-ft-se-ic))
1258
+ );
1259
+ text-align: var(
1260
+ --_ctm-mob-dn-al-pe-tt-an,
1261
+ var(--_ctm-tab-dn-al-pe-tt-an, var(--_ctm-dn-al-pe-tt-an))
1262
+ );
1263
+ letter-spacing: var(
1264
+ --_ctm-mob-dn-al-pe-lr-sg,
1265
+ var(--_ctm-tab-dn-al-pe-lr-sg, var(--_ctm-dn-al-pe-lr-sg))
1266
+ );
1267
+ line-height: var(
1268
+ --_ctm-mob-dn-al-pe-le-ht,
1269
+ var(--_ctm-tab-dn-al-pe-le-ht, var(--_ctm-dn-al-pe-le-ht))
1270
+ );
1271
+ text-decoration: var(
1272
+ --_ctm-mob-dn-al-pe-ue,
1273
+ var(--_ctm-tab-dn-al-pe-ue, var(--_ctm-dn-al-pe-ue))
1274
+ );
1275
+
1276
+ border-color: var(
1277
+ --_show-border,
1278
+ var(
1279
+ --_ctm-mob-dn-al-pe-br-cr,
1280
+ var(--_ctm-tab-dn-al-pe-br-cr, var(--_ctm-dn-al-pe-br-cr))
1281
+ )
1282
+ );
1283
+ border-style: var(
1284
+ --_show-border,
1285
+ var(
1286
+ --_ctm-mob-dn-al-pe-br-se,
1287
+ var(--_ctm-tab-dn-al-pe-br-se, var(--_ctm-dn-al-pe-br-se))
1288
+ )
1289
+ );
1290
+ border-width: var(
1291
+ --_show-border,
1292
+ var(
1293
+ --_ctm-mob-dn-al-pe-br-wh,
1294
+ var(--_ctm-tab-dn-al-pe-br-wh, var(--_ctm-dn-al-pe-br-wh))
1295
+ )
1296
+ );
1297
+ border-radius: var(
1298
+ --_ctm-mob-dn-al-pe-br-rs,
1299
+ var(--_ctm-tab-dn-al-pe-br-rs, var(--_ctm-dn-al-pe-br-rs))
1300
+ );
1301
+
1302
+ box-shadow: var(
1303
+ --_show-shadow,
1304
+ var(
1305
+ --_ctm-mob-dn-al-pe-sw-ae,
1306
+ var(--_ctm-tab-dn-al-pe-sw-ae, var(--_ctm-dn-al-pe-sw-ae))
1307
+ )
1308
+ var(
1309
+ --_ctm-mob-dn-al-pe-sw-br,
1310
+ var(--_ctm-tab-dn-al-pe-sw-br, var(--_ctm-dn-al-pe-sw-br))
1311
+ )
1312
+ var(
1313
+ --_ctm-mob-dn-al-pe-sw-sd,
1314
+ var(--_ctm-tab-dn-al-pe-sw-sd, var(--_ctm-dn-al-pe-sw-sd))
1315
+ )
1316
+ var(
1317
+ --_ctm-mob-dn-al-pe-sw-cr,
1318
+ var(--_ctm-tab-dn-al-pe-sw-cr, var(--_ctm-dn-al-pe-sw-cr))
1319
+ )
1320
+ );
1321
+ }
1322
+
1323
+ .code-span {
1324
+ background-color: var(
1325
+ --_ctm-mob-dn-cy-ce-se-bd-cr,
1326
+ var(--_ctm-tab-dn-cy-ce-se-bd-cr, var(--_ctm-dn-cy-ce-se-bd-cr))
1327
+ );
1328
+ color: var(
1329
+ --_ctm-mob-dn-cy-ce-se-cr,
1330
+ var(--_ctm-tab-dn-cy-ce-se-cr, var(--_ctm-dn-cy-ce-se-cr))
1331
+ );
1332
+ font-family:
1333
+ var(
1334
+ --_ctm-mob-dn-cy-ce-se-ft-fy,
1335
+ var(--_ctm-tab-dn-cy-ce-se-ft-fy, var(--_ctm-dn-cy-ce-se-ft-fy))
1336
+ ),
1337
+ sans-serif;
1338
+ font-size: var(
1339
+ --_ctm-mob-dn-cy-ce-se-ft-se,
1340
+ var(--_ctm-tab-dn-cy-ce-se-ft-se, var(--_ctm-dn-cy-ce-se-ft-se))
1341
+ );
1342
+ font-weight: var(
1343
+ --_ctm-mob-dn-cy-ce-se-ft-wt,
1344
+ var(--_ctm-tab-dn-cy-ce-se-ft-wt, var(--_ctm-dn-cy-ce-se-ft-wt))
1345
+ );
1346
+ font-style: var(
1347
+ --_ctm-mob-dn-cy-ce-se-ft-se-ic,
1348
+ var(--_ctm-tab-dn-cy-ce-se-ft-se-ic, var(--_ctm-dn-cy-ce-se-ft-se-ic))
1349
+ );
1350
+ text-align: var(
1351
+ --_ctm-mob-dn-cy-ce-se-tt-an,
1352
+ var(--_ctm-tab-dn-cy-ce-se-tt-an, var(--_ctm-dn-cy-ce-se-tt-an))
1353
+ );
1354
+ letter-spacing: var(
1355
+ --_ctm-mob-dn-cy-ce-se-lr-sg,
1356
+ var(--_ctm-tab-dn-cy-ce-se-lr-sg, var(--_ctm-dn-cy-ce-se-lr-sg))
1357
+ );
1358
+ line-height: var(
1359
+ --_ctm-mob-dn-cy-ce-se-le-ht,
1360
+ var(--_ctm-tab-dn-cy-ce-se-le-ht, var(--_ctm-dn-cy-ce-se-le-ht))
1361
+ );
1362
+ text-decoration: var(
1363
+ --_ctm-mob-dn-cy-ce-se-ue,
1364
+ var(--_ctm-tab-dn-cy-ce-se-ue, var(--_ctm-dn-cy-ce-se-ue))
1365
+ );
1366
+
1367
+ border-color: var(
1368
+ --_show-border,
1369
+ var(
1370
+ --_ctm-mob-dn-cy-ce-se-br-cr,
1371
+ var(--_ctm-tab-dn-cy-ce-se-br-cr, var(--_ctm-dn-cy-ce-se-br-cr))
1372
+ )
1373
+ );
1374
+ border-style: var(
1375
+ --_show-border,
1376
+ var(
1377
+ --_ctm-mob-dn-cy-ce-se-br-se,
1378
+ var(--_ctm-tab-dn-cy-ce-se-br-se, var(--_ctm-dn-cy-ce-se-br-se))
1379
+ )
1380
+ );
1381
+ border-width: var(
1382
+ --_show-border,
1383
+ var(
1384
+ --_ctm-mob-dn-cy-ce-se-br-wh,
1385
+ var(--_ctm-tab-dn-cy-ce-se-br-wh, var(--_ctm-dn-cy-ce-se-br-wh))
1386
+ )
1387
+ );
1388
+ border-radius: var(
1389
+ --_ctm-mob-dn-cy-ce-se-br-rs,
1390
+ var(--_ctm-tab-dn-cy-ce-se-br-rs, var(--_ctm-dn-cy-ce-se-br-rs))
1391
+ );
1392
+
1393
+ box-shadow: var(
1394
+ --_show-shadow,
1395
+ var(
1396
+ --_ctm-mob-dn-cy-ce-se-sw-ae,
1397
+ var(--_ctm-tab-dn-cy-ce-se-sw-ae, var(--_ctm-dn-cy-ce-se-sw-ae))
1398
+ )
1399
+ var(
1400
+ --_ctm-mob-dn-cy-ce-se-sw-br,
1401
+ var(--_ctm-tab-dn-cy-ce-se-sw-br, var(--_ctm-dn-cy-ce-se-sw-br))
1402
+ )
1403
+ var(
1404
+ --_ctm-mob-dn-cy-ce-se-sw-sd,
1405
+ var(--_ctm-tab-dn-cy-ce-se-sw-sd, var(--_ctm-dn-cy-ce-se-sw-sd))
1406
+ )
1407
+ var(
1408
+ --_ctm-mob-dn-cy-ce-se-sw-cr,
1409
+ var(--_ctm-tab-dn-cy-ce-se-sw-cr, var(--_ctm-dn-cy-ce-se-sw-cr))
1410
+ )
1411
+ );
1412
+ }
1413
+
1414
+ .uom-span {
1415
+ background-color: var(
1416
+ --_ctm-mob-dn-um-se-bd-cr,
1417
+ var(--_ctm-tab-dn-um-se-bd-cr, var(--_ctm-dn-um-se-bd-cr))
1418
+ );
1419
+ color: var(--_ctm-mob-dn-um-se-cr, var(--_ctm-tab-dn-um-se-cr, var(--_ctm-dn-um-se-cr)));
1420
+ font-family:
1421
+ var(
1422
+ --_ctm-mob-dn-um-se-ft-fy,
1423
+ var(--_ctm-tab-dn-um-se-ft-fy, var(--_ctm-dn-um-se-ft-fy))
1424
+ ),
1425
+ sans-serif;
1426
+ font-size: var(
1427
+ --_ctm-mob-dn-um-se-ft-se,
1428
+ var(--_ctm-tab-dn-um-se-ft-se, var(--_ctm-dn-um-se-ft-se))
1429
+ );
1430
+ font-weight: var(
1431
+ --_ctm-mob-dn-um-se-ft-wt,
1432
+ var(--_ctm-tab-dn-um-se-ft-wt, var(--_ctm-dn-um-se-ft-wt))
1433
+ );
1434
+ font-style: var(
1435
+ --_ctm-mob-dn-um-se-ft-se-ic,
1436
+ var(--_ctm-tab-dn-um-se-ft-se-ic, var(--_ctm-dn-um-se-ft-se-ic))
1437
+ );
1438
+ text-align: var(
1439
+ --_ctm-mob-dn-um-se-tt-an,
1440
+ var(--_ctm-tab-dn-um-se-tt-an, var(--_ctm-dn-um-se-tt-an))
1441
+ );
1442
+ letter-spacing: var(
1443
+ --_ctm-mob-dn-um-se-lr-sg,
1444
+ var(--_ctm-tab-dn-um-se-lr-sg, var(--_ctm-dn-um-se-lr-sg))
1445
+ );
1446
+ line-height: var(
1447
+ --_ctm-mob-dn-um-se-le-ht,
1448
+ var(--_ctm-tab-dn-um-se-le-ht, var(--_ctm-dn-um-se-le-ht))
1449
+ );
1450
+ text-decoration: var(
1451
+ --_ctm-mob-dn-um-se-ue,
1452
+ var(--_ctm-tab-dn-um-se-ue, var(--_ctm-dn-um-se-ue))
1453
+ );
1454
+
1455
+ border-color: var(
1456
+ --_show-border,
1457
+ var(
1458
+ --_ctm-mob-dn-um-se-br-cr,
1459
+ var(--_ctm-tab-dn-um-se-br-cr, var(--_ctm-dn-um-se-br-cr))
1460
+ )
1461
+ );
1462
+ border-style: var(
1463
+ --_show-border,
1464
+ var(
1465
+ --_ctm-mob-dn-um-se-br-se,
1466
+ var(--_ctm-tab-dn-um-se-br-se, var(--_ctm-dn-um-se-br-se))
1467
+ )
1468
+ );
1469
+ border-width: var(
1470
+ --_show-border,
1471
+ var(
1472
+ --_ctm-mob-dn-um-se-br-wh,
1473
+ var(--_ctm-tab-dn-um-se-br-wh, var(--_ctm-dn-um-se-br-wh))
1474
+ )
1475
+ );
1476
+ border-radius: var(
1477
+ --_ctm-mob-dn-um-se-br-rs,
1478
+ var(--_ctm-tab-dn-um-se-br-rs, var(--_ctm-dn-um-se-br-rs))
1479
+ );
1480
+
1481
+ box-shadow: var(
1482
+ --_show-shadow,
1483
+ var(
1484
+ --_ctm-mob-dn-um-se-sw-ae,
1485
+ var(--_ctm-tab-dn-um-se-sw-ae, var(--_ctm-dn-um-se-sw-ae))
1486
+ )
1487
+ var(
1488
+ --_ctm-mob-dn-um-se-sw-br,
1489
+ var(--_ctm-tab-dn-um-se-sw-br, var(--_ctm-dn-um-se-sw-br))
1490
+ )
1491
+ var(
1492
+ --_ctm-mob-dn-um-se-sw-sd,
1493
+ var(--_ctm-tab-dn-um-se-sw-sd, var(--_ctm-dn-um-se-sw-sd))
1494
+ )
1495
+ var(
1496
+ --_ctm-mob-dn-um-se-sw-cr,
1497
+ var(--_ctm-tab-dn-um-se-sw-cr, var(--_ctm-dn-um-se-sw-cr))
1498
+ )
1499
+ );
1500
+ }
1501
+ }
1502
+ }
1503
+ .product-savings {
1504
+ .product-savings-wrapper {
1505
+ .savings-percent-span {
1506
+ background-color: var(
1507
+ --_ctm-mob-dn-ss-bd-cr,
1508
+ var(--_ctm-tab-dn-ss-bd-cr, var(--_ctm-dn-ss-bd-cr))
1509
+ );
1510
+ color: var(--_ctm-mob-dn-ss-cr, var(--_ctm-tab-dn-ss-cr, var(--_ctm-dn-ss-cr)));
1511
+ font-family:
1512
+ var(--_ctm-mob-dn-ss-ft-fy, var(--_ctm-tab-dn-ss-ft-fy, var(--_ctm-dn-ss-ft-fy))),
1513
+ sans-serif;
1514
+ font-size: var(
1515
+ --_ctm-mob-dn-ss-ft-se,
1516
+ var(--_ctm-tab-dn-ss-ft-se, var(--_ctm-dn-ss-ft-se))
1517
+ );
1518
+ font-weight: var(
1519
+ --_ctm-mob-dn-ss-ft-wt,
1520
+ var(--_ctm-tab-dn-ss-ft-wt, var(--_ctm-dn-ss-ft-wt))
1521
+ );
1522
+ font-style: var(
1523
+ --_ctm-mob-dn-ss-ft-se-ic,
1524
+ var(--_ctm-tab-dn-ss-ft-se-ic, var(--_ctm-dn-ss-ft-se-ic))
1525
+ );
1526
+ text-align: var(
1527
+ --_ctm-mob-dn-ss-tt-an,
1528
+ var(--_ctm-tab-dn-ss-tt-an, var(--_ctm-dn-ss-tt-an))
1529
+ );
1530
+ letter-spacing: var(
1531
+ --_ctm-mob-dn-ss-lr-sg,
1532
+ var(--_ctm-tab-dn-ss-lr-sg, var(--_ctm-dn-ss-lr-sg))
1533
+ );
1534
+ line-height: var(
1535
+ --_ctm-mob-dn-ss-le-ht,
1536
+ var(--_ctm-tab-dn-ss-le-ht, var(--_ctm-dn-ss-le-ht))
1537
+ );
1538
+ text-decoration: var(--_ctm-mob-dn-ss-ue, var(--_ctm-tab-dn-ss-ue, var(--_ctm-dn-ss-ue)));
1539
+
1540
+ border-color: var(
1541
+ --_show-border,
1542
+ var(--_ctm-mob-dn-ss-br-cr, var(--_ctm-tab-dn-ss-br-cr, var(--_ctm-dn-ss-br-cr)))
1543
+ );
1544
+ border-style: var(
1545
+ --_show-border,
1546
+ var(--_ctm-mob-dn-ss-br-se, var(--_ctm-tab-dn-ss-br-se, var(--_ctm-dn-ss-br-se)))
1547
+ );
1548
+ border-width: var(
1549
+ --_show-border,
1550
+ var(--_ctm-mob-dn-ss-br-wh, var(--_ctm-tab-dn-ss-br-wh, var(--_ctm-dn-ss-br-wh)))
1551
+ );
1552
+ border-radius: var(
1553
+ --_ctm-mob-dn-ss-br-rs,
1554
+ var(--_ctm-tab-dn-ss-br-rs, var(--_ctm-dn-ss-br-rs))
1555
+ );
1556
+
1557
+ box-shadow: var(
1558
+ --_show-shadow,
1559
+ var(--_ctm-mob-dn-ss-sw-ae, var(--_ctm-tab-dn-ss-sw-ae, var(--_ctm-dn-ss-sw-ae)))
1560
+ var(--_ctm-mob-dn-ss-sw-br, var(--_ctm-tab-dn-ss-sw-br, var(--_ctm-dn-ss-sw-br)))
1561
+ var(--_ctm-mob-dn-ss-sw-sd, var(--_ctm-tab-dn-ss-sw-sd, var(--_ctm-dn-ss-sw-sd)))
1562
+ var(--_ctm-mob-dn-ss-sw-cr, var(--_ctm-tab-dn-ss-sw-cr, var(--_ctm-dn-ss-sw-cr)))
1563
+ );
1564
+ }
1565
+ .savings-value-span {
1566
+ background-color: var(
1567
+ --_ctm-mob-dn-ss-ve-bd-cr,
1568
+ var(--_ctm-tab-dn-ss-ve-bd-cr, var(--_ctm-dn-ss-ve-bd-cr))
1569
+ );
1570
+ color: var(--_ctm-mob-dn-ss-ve-cr, var(--_ctm-tab-dn-ss-ve-cr, var(--_ctm-dn-ss-ve-cr)));
1571
+ font-family:
1572
+ var(
1573
+ --_ctm-mob-dn-ss-ve-ft-fy,
1574
+ var(--_ctm-tab-dn-ss-ve-ft-fy, var(--_ctm-dn-ss-ve-ft-fy))
1575
+ ),
1576
+ sans-serif;
1577
+ font-size: var(
1578
+ --_ctm-mob-dn-ss-ve-ft-se,
1579
+ var(--_ctm-tab-dn-ss-ve-ft-se, var(--_ctm-dn-ss-ve-ft-se))
1580
+ );
1581
+ font-weight: var(
1582
+ --_ctm-mob-dn-ss-ve-ft-wt,
1583
+ var(--_ctm-tab-dn-ss-ve-ft-wt, var(--_ctm-dn-ss-ve-ft-wt))
1584
+ );
1585
+ font-style: var(
1586
+ --_ctm-mob-dn-ss-ve-ft-se-ic,
1587
+ var(--_ctm-tab-dn-ss-ve-ft-se-ic, var(--_ctm-dn-ss-ve-ft-se-ic))
1588
+ );
1589
+ text-align: var(
1590
+ --_ctm-mob-dn-ss-ve-tt-an,
1591
+ var(--_ctm-tab-dn-ss-ve-tt-an, var(--_ctm-dn-ss-ve-tt-an))
1592
+ );
1593
+ letter-spacing: var(
1594
+ --_ctm-mob-dn-ss-ve-lr-sg,
1595
+ var(--_ctm-tab-dn-ss-ve-lr-sg, var(--_ctm-dn-ss-ve-lr-sg))
1596
+ );
1597
+ line-height: var(
1598
+ --_ctm-mob-dn-ss-ve-le-ht,
1599
+ var(--_ctm-tab-dn-ss-ve-le-ht, var(--_ctm-dn-ss-ve-le-ht))
1600
+ );
1601
+ text-decoration: var(
1602
+ --_ctm-mob-dn-ss-ve-ue,
1603
+ var(--_ctm-tab-dn-ss-ve-ue, var(--_ctm-dn-ss-ve-ue))
1604
+ );
1605
+
1606
+ border-color: var(
1607
+ --_show-border,
1608
+ var(
1609
+ --_ctm-mob-dn-ss-ve-br-cr,
1610
+ var(--_ctm-tab-dn-ss-ve-br-cr, var(--_ctm-dn-ss-ve-br-cr))
1611
+ )
1612
+ );
1613
+ border-style: var(
1614
+ --_show-border,
1615
+ var(
1616
+ --_ctm-mob-dn-ss-ve-br-se,
1617
+ var(--_ctm-tab-dn-ss-ve-br-se, var(--_ctm-dn-ss-ve-br-se))
1618
+ )
1619
+ );
1620
+ border-width: var(
1621
+ --_show-border,
1622
+ var(
1623
+ --_ctm-mob-dn-ss-ve-br-wh,
1624
+ var(--_ctm-tab-dn-ss-ve-br-wh, var(--_ctm-dn-ss-ve-br-wh))
1625
+ )
1626
+ );
1627
+ border-radius: var(
1628
+ --_ctm-mob-dn-ss-ve-br-rs,
1629
+ var(--_ctm-tab-dn-ss-ve-br-rs, var(--_ctm-dn-ss-ve-br-rs))
1630
+ );
1631
+
1632
+ box-shadow: var(
1633
+ --_show-shadow,
1634
+ var(
1635
+ --_ctm-mob-dn-ss-ve-sw-ae,
1636
+ var(--_ctm-tab-dn-ss-ve-sw-ae, var(--_ctm-dn-ss-ve-sw-ae))
1637
+ )
1638
+ var(
1639
+ --_ctm-mob-dn-ss-ve-sw-br,
1640
+ var(--_ctm-tab-dn-ss-ve-sw-br, var(--_ctm-dn-ss-ve-sw-br))
1641
+ )
1642
+ var(
1643
+ --_ctm-mob-dn-ss-ve-sw-sd,
1644
+ var(--_ctm-tab-dn-ss-ve-sw-sd, var(--_ctm-dn-ss-ve-sw-sd))
1645
+ )
1646
+ var(
1647
+ --_ctm-mob-dn-ss-ve-sw-cr,
1648
+ var(--_ctm-tab-dn-ss-ve-sw-cr, var(--_ctm-dn-ss-ve-sw-cr))
1649
+ )
1650
+ );
1651
+ }
1652
+ .code-span {
1653
+ background-color: var(
1654
+ --_ctm-mob-dn-cy-ce-se-bd-cr,
1655
+ var(--_ctm-tab-dn-cy-ce-se-bd-cr, var(--_ctm-dn-cy-ce-se-bd-cr))
1656
+ );
1657
+ color: var(
1658
+ --_ctm-mob-dn-cy-ce-se-cr,
1659
+ var(--_ctm-tab-dn-cy-ce-se-cr, var(--_ctm-dn-cy-ce-se-cr))
1660
+ );
1661
+ font-family:
1662
+ var(
1663
+ --_ctm-mob-dn-cy-ce-se-ft-fy,
1664
+ var(--_ctm-tab-dn-cy-ce-se-ft-fy, var(--_ctm-dn-cy-ce-se-ft-fy))
1665
+ ),
1666
+ sans-serif;
1667
+ font-size: var(
1668
+ --_ctm-mob-dn-cy-ce-se-ft-se,
1669
+ var(--_ctm-tab-dn-cy-ce-se-ft-se, var(--_ctm-dn-cy-ce-se-ft-se))
1670
+ );
1671
+ font-weight: var(
1672
+ --_ctm-mob-dn-cy-ce-se-ft-wt,
1673
+ var(--_ctm-tab-dn-cy-ce-se-ft-wt, var(--_ctm-dn-cy-ce-se-ft-wt))
1674
+ );
1675
+ font-style: var(
1676
+ --_ctm-mob-dn-cy-ce-se-ft-se-ic,
1677
+ var(--_ctm-tab-dn-cy-ce-se-ft-se-ic, var(--_ctm-dn-cy-ce-se-ft-se-ic))
1678
+ );
1679
+ text-align: var(
1680
+ --_ctm-mob-dn-cy-ce-se-tt-an,
1681
+ var(--_ctm-tab-dn-cy-ce-se-tt-an, var(--_ctm-dn-cy-ce-se-tt-an))
1682
+ );
1683
+ letter-spacing: var(
1684
+ --_ctm-mob-dn-cy-ce-se-lr-sg,
1685
+ var(--_ctm-tab-dn-cy-ce-se-lr-sg, var(--_ctm-dn-cy-ce-se-lr-sg))
1686
+ );
1687
+ line-height: var(
1688
+ --_ctm-mob-dn-cy-ce-se-le-ht,
1689
+ var(--_ctm-tab-dn-cy-ce-se-le-ht, var(--_ctm-dn-cy-ce-se-le-ht))
1690
+ );
1691
+ text-decoration: var(
1692
+ --_ctm-mob-dn-cy-ce-se-ue,
1693
+ var(--_ctm-tab-dn-cy-ce-se-ue, var(--_ctm-dn-cy-ce-se-ue))
1694
+ );
1695
+
1696
+ border-color: var(
1697
+ --_show-border,
1698
+ var(
1699
+ --_ctm-mob-dn-cy-ce-se-br-cr,
1700
+ var(--_ctm-tab-dn-cy-ce-se-br-cr, var(--_ctm-dn-cy-ce-se-br-cr))
1701
+ )
1702
+ );
1703
+ border-style: var(
1704
+ --_show-border,
1705
+ var(
1706
+ --_ctm-mob-dn-cy-ce-se-br-se,
1707
+ var(--_ctm-tab-dn-cy-ce-se-br-se, var(--_ctm-dn-cy-ce-se-br-se))
1708
+ )
1709
+ );
1710
+ border-width: var(
1711
+ --_show-border,
1712
+ var(
1713
+ --_ctm-mob-dn-cy-ce-se-br-wh,
1714
+ var(--_ctm-tab-dn-cy-ce-se-br-wh, var(--_ctm-dn-cy-ce-se-br-wh))
1715
+ )
1716
+ );
1717
+ border-radius: var(
1718
+ --_ctm-mob-dn-cy-ce-se-br-rs,
1719
+ var(--_ctm-tab-dn-cy-ce-se-br-rs, var(--_ctm-dn-cy-ce-se-br-rs))
1720
+ );
1721
+
1722
+ box-shadow: var(
1723
+ --_show-shadow,
1724
+ var(
1725
+ --_ctm-mob-dn-cy-ce-se-sw-ae,
1726
+ var(--_ctm-tab-dn-cy-ce-se-sw-ae, var(--_ctm-dn-cy-ce-se-sw-ae))
1727
+ )
1728
+ var(
1729
+ --_ctm-mob-dn-cy-ce-se-sw-br,
1730
+ var(--_ctm-tab-dn-cy-ce-se-sw-br, var(--_ctm-dn-cy-ce-se-sw-br))
1731
+ )
1732
+ var(
1733
+ --_ctm-mob-dn-cy-ce-se-sw-sd,
1734
+ var(--_ctm-tab-dn-cy-ce-se-sw-sd, var(--_ctm-dn-cy-ce-se-sw-sd))
1735
+ )
1736
+ var(
1737
+ --_ctm-mob-dn-cy-ce-se-sw-cr,
1738
+ var(--_ctm-tab-dn-cy-ce-se-sw-cr, var(--_ctm-dn-cy-ce-se-sw-cr))
1739
+ )
1740
+ );
1741
+ }
1742
+ }
1743
+ }
1744
+ .total-price-container {
1745
+ .tax-box {
1746
+ display: flex;
1747
+ align-items: center;
1748
+ justify-content: space-between;
1749
+ gap: 5px;
1750
+
1751
+ background-color: var(
1752
+ --_ctm-mob-dn-pt-tx-bd-cr,
1753
+ var(--_ctm-tab-dn-pt-tx-bd-cr, var(--_ctm-dn-pt-tx-bd-cr))
1754
+ );
1755
+ color: var(--_ctm-mob-dn-pt-tx-cr, var(--_ctm-tab-dn-pt-tx-cr, var(--_ctm-dn-pt-tx-cr)));
1756
+ font-family:
1757
+ var(
1758
+ --_ctm-mob-dn-pt-tx-ft-fy,
1759
+ var(--_ctm-tab-dn-pt-tx-ft-fy, var(--_ctm-dn-pt-tx-ft-fy))
1760
+ ),
1761
+ sans-serif;
1762
+ font-size: var(
1763
+ --_ctm-mob-dn-pt-tx-ft-se,
1764
+ var(--_ctm-tab-dn-pt-tx-ft-se, var(--_ctm-dn-pt-tx-ft-se))
1765
+ );
1766
+ font-weight: var(
1767
+ --_ctm-mob-dn-pt-tx-ft-wt,
1768
+ var(--_ctm-tab-dn-pt-tx-ft-wt, var(--_ctm-dn-pt-tx-ft-wt))
1769
+ );
1770
+ font-style: var(
1771
+ --_ctm-mob-dn-pt-tx-ft-se-ic,
1772
+ var(--_ctm-tab-dn-pt-tx-ft-se-ic, var(--_ctm-dn-pt-tx-ft-se-ic))
1773
+ );
1774
+ text-align: var(
1775
+ --_ctm-mob-dn-pt-tx-tt-an,
1776
+ var(--_ctm-tab-dn-pt-tx-tt-an, var(--_ctm-dn-pt-tx-tt-an))
1777
+ );
1778
+ letter-spacing: var(
1779
+ --_ctm-mob-dn-pt-tx-lr-sg,
1780
+ var(--_ctm-tab-dn-pt-tx-lr-sg, var(--_ctm-dn-pt-tx-lr-sg))
1781
+ );
1782
+ line-height: var(
1783
+ --_ctm-mob-dn-pt-tx-le-ht,
1784
+ var(--_ctm-tab-dn-pt-tx-le-ht, var(--_ctm-dn-pt-tx-le-ht))
1785
+ );
1786
+ text-decoration: var(
1787
+ --_ctm-mob-dn-pt-tx-ue,
1788
+ var(--_ctm-tab-dn-pt-tx-ue, var(--_ctm-dn-pt-tx-ue))
1789
+ );
1790
+
1791
+ border-color: var(
1792
+ --_show-border,
1793
+ var(--_ctm-mob-dn-pt-tx-br-cr, var(--_ctm-tab-dn-pt-tx-br-cr, var(--_ctm-dn-pt-tx-br-cr)))
1794
+ );
1795
+ border-style: var(
1796
+ --_show-border,
1797
+ var(--_ctm-mob-dn-pt-tx-br-se, var(--_ctm-tab-dn-pt-tx-br-se, var(--_ctm-dn-pt-tx-br-se)))
1798
+ );
1799
+ border-width: var(
1800
+ --_show-border,
1801
+ var(--_ctm-mob-dn-pt-tx-br-wh, var(--_ctm-tab-dn-pt-tx-br-wh, var(--_ctm-dn-pt-tx-br-wh)))
1802
+ );
1803
+ border-radius: var(
1804
+ --_ctm-mob-dn-pt-tx-br-rs,
1805
+ var(--_ctm-tab-dn-pt-tx-br-rs, var(--_ctm-dn-pt-tx-br-rs))
1806
+ );
1807
+
1808
+ box-shadow: var(
1809
+ --_show-shadow,
1810
+ var(--_ctm-mob-dn-pt-tx-sw-ae, var(--_ctm-tab-dn-pt-tx-sw-ae, var(--_ctm-dn-pt-tx-sw-ae)))
1811
+ var(
1812
+ --_ctm-mob-dn-pt-tx-sw-br,
1813
+ var(--_ctm-tab-dn-pt-tx-sw-br, var(--_ctm-dn-pt-tx-sw-br))
1814
+ )
1815
+ var(
1816
+ --_ctm-mob-dn-pt-tx-sw-sd,
1817
+ var(--_ctm-tab-dn-pt-tx-sw-sd, var(--_ctm-dn-pt-tx-sw-sd))
1818
+ )
1819
+ var(
1820
+ --_ctm-mob-dn-pt-tx-sw-cr,
1821
+ var(--_ctm-tab-dn-pt-tx-sw-cr, var(--_ctm-dn-pt-tx-sw-cr))
1822
+ )
1823
+ );
1824
+ }
1825
+ .shipping-box {
1826
+ display: flex;
1827
+ align-items: center;
1828
+ justify-content: space-between;
1829
+ gap: 5px;
1830
+
1831
+ background-color: var(
1832
+ --_ctm-mob-dn-pt-sg-pe-bd-cr,
1833
+ var(--_ctm-tab-dn-pt-sg-pe-bd-cr, var(--_ctm-dn-pt-sg-pe-bd-cr))
1834
+ );
1835
+ color: var(
1836
+ --_ctm-mob-dn-pt-sg-pe-cr,
1837
+ var(--_ctm-tab-dn-pt-sg-pe-cr, var(--_ctm-dn-pt-sg-pe-cr))
1838
+ );
1839
+ font-family:
1840
+ var(
1841
+ --_ctm-mob-dn-pt-sg-pe-ft-fy,
1842
+ var(--_ctm-tab-dn-pt-sg-pe-ft-fy, var(--_ctm-dn-pt-sg-pe-ft-fy))
1843
+ ),
1844
+ sans-serif;
1845
+ font-size: var(
1846
+ --_ctm-mob-dn-pt-sg-pe-ft-se,
1847
+ var(--_ctm-tab-dn-pt-sg-pe-ft-se, var(--_ctm-dn-pt-sg-pe-ft-se))
1848
+ );
1849
+ font-weight: var(
1850
+ --_ctm-mob-dn-pt-sg-pe-ft-wt,
1851
+ var(--_ctm-tab-dn-pt-sg-pe-ft-wt, var(--_ctm-dn-pt-sg-pe-ft-wt))
1852
+ );
1853
+ font-style: var(
1854
+ --_ctm-mob-dn-pt-sg-pe-ft-se-ic,
1855
+ var(--_ctm-tab-dn-pt-sg-pe-ft-se-ic, var(--_ctm-dn-pt-sg-pe-ft-se-ic))
1856
+ );
1857
+ text-align: var(
1858
+ --_ctm-mob-dn-pt-sg-pe-tt-an,
1859
+ var(--_ctm-tab-dn-pt-sg-pe-tt-an, var(--_ctm-dn-pt-sg-pe-tt-an))
1860
+ );
1861
+ letter-spacing: var(
1862
+ --_ctm-mob-dn-pt-sg-pe-lr-sg,
1863
+ var(--_ctm-tab-dn-pt-sg-pe-lr-sg, var(--_ctm-dn-pt-sg-pe-lr-sg))
1864
+ );
1865
+ line-height: var(
1866
+ --_ctm-mob-dn-pt-sg-pe-le-ht,
1867
+ var(--_ctm-tab-dn-pt-sg-pe-le-ht, var(--_ctm-dn-pt-sg-pe-le-ht))
1868
+ );
1869
+ text-decoration: var(
1870
+ --_ctm-mob-dn-pt-sg-pe-ue,
1871
+ var(--_ctm-tab-dn-pt-sg-pe-ue, var(--_ctm-dn-pt-sg-pe-ue))
1872
+ );
1873
+
1874
+ border-color: var(
1875
+ --_show-border,
1876
+ var(
1877
+ --_ctm-mob-dn-pt-sg-pe-br-cr,
1878
+ var(--_ctm-tab-dn-pt-sg-pe-br-cr, var(--_ctm-dn-pt-sg-pe-br-cr))
1879
+ )
1880
+ );
1881
+ border-style: var(
1882
+ --_show-border,
1883
+ var(
1884
+ --_ctm-mob-dn-pt-sg-pe-br-se,
1885
+ var(--_ctm-tab-dn-pt-sg-pe-br-se, var(--_ctm-dn-pt-sg-pe-br-se))
1886
+ )
1887
+ );
1888
+ border-width: var(
1889
+ --_show-border,
1890
+ var(
1891
+ --_ctm-mob-dn-pt-sg-pe-br-wh,
1892
+ var(--_ctm-tab-dn-pt-sg-pe-br-wh, var(--_ctm-dn-pt-sg-pe-br-wh))
1893
+ )
1894
+ );
1895
+ border-radius: var(
1896
+ --_ctm-mob-dn-pt-sg-pe-br-rs,
1897
+ var(--_ctm-tab-dn-pt-sg-pe-br-rs, var(--_ctm-dn-pt-sg-pe-br-rs))
1898
+ );
1899
+
1900
+ box-shadow: var(
1901
+ --_show-shadow,
1902
+ var(
1903
+ --_ctm-mob-dn-pt-sg-pe-sw-ae,
1904
+ var(--_ctm-tab-dn-pt-sg-pe-sw-ae, var(--_ctm-dn-pt-sg-pe-sw-ae))
1905
+ )
1906
+ var(
1907
+ --_ctm-mob-dn-pt-sg-pe-sw-br,
1908
+ var(--_ctm-tab-dn-pt-sg-pe-sw-br, var(--_ctm-dn-pt-sg-pe-sw-br))
1909
+ )
1910
+ var(
1911
+ --_ctm-mob-dn-pt-sg-pe-sw-sd,
1912
+ var(--_ctm-tab-dn-pt-sg-pe-sw-sd, var(--_ctm-dn-pt-sg-pe-sw-sd))
1913
+ )
1914
+ var(
1915
+ --_ctm-mob-dn-pt-sg-pe-sw-cr,
1916
+ var(--_ctm-tab-dn-pt-sg-pe-sw-cr, var(--_ctm-dn-pt-sg-pe-sw-cr))
1917
+ )
1918
+ );
1919
+ }
1920
+ .embellishment-box {
1921
+ display: flex;
1922
+ align-items: center;
1923
+ justify-content: space-between;
1924
+ gap: 5px;
1925
+
1926
+ background-color: var(
1927
+ --_ctm-mob-dn-et-pe-bd-cr,
1928
+ var(--_ctm-tab-dn-et-pe-bd-cr, var(--_ctm-dn-et-pe-bd-cr))
1929
+ );
1930
+ color: var(--_ctm-mob-dn-et-pe-cr, var(--_ctm-tab-dn-et-pe-cr, var(--_ctm-dn-et-pe-cr)));
1931
+ font-family:
1932
+ var(
1933
+ --_ctm-mob-dn-et-pe-ft-fy,
1934
+ var(--_ctm-tab-dn-et-pe-ft-fy, var(--_ctm-dn-et-pe-ft-fy))
1935
+ ),
1936
+ sans-serif;
1937
+ font-size: var(
1938
+ --_ctm-mob-dn-et-pe-ft-se,
1939
+ var(--_ctm-tab-dn-et-pe-ft-se, var(--_ctm-dn-et-pe-ft-se))
1940
+ );
1941
+ font-weight: var(
1942
+ --_ctm-mob-dn-et-pe-ft-wt,
1943
+ var(--_ctm-tab-dn-et-pe-ft-wt, var(--_ctm-dn-et-pe-ft-wt))
1944
+ );
1945
+ font-style: var(
1946
+ --_ctm-mob-dn-et-pe-ft-se-ic,
1947
+ var(--_ctm-tab-dn-et-pe-ft-se-ic, var(--_ctm-dn-et-pe-ft-se-ic))
1948
+ );
1949
+ text-align: var(
1950
+ --_ctm-mob-dn-et-pe-tt-an,
1951
+ var(--_ctm-tab-dn-et-pe-tt-an, var(--_ctm-dn-et-pe-tt-an))
1952
+ );
1953
+ letter-spacing: var(
1954
+ --_ctm-mob-dn-et-pe-lr-sg,
1955
+ var(--_ctm-tab-dn-et-pe-lr-sg, var(--_ctm-dn-et-pe-lr-sg))
1956
+ );
1957
+ line-height: var(
1958
+ --_ctm-mob-dn-et-pe-le-ht,
1959
+ var(--_ctm-tab-dn-et-pe-le-ht, var(--_ctm-dn-et-pe-le-ht))
1960
+ );
1961
+ text-decoration: var(
1962
+ --_ctm-mob-dn-et-pe-ue,
1963
+ var(--_ctm-tab-dn-et-pe-ue, var(--_ctm-dn-et-pe-ue))
1964
+ );
1965
+
1966
+ border-color: var(
1967
+ --_show-border,
1968
+ var(--_ctm-mob-dn-et-pe-br-cr, var(--_ctm-tab-dn-et-pe-br-cr, var(--_ctm-dn-et-pe-br-cr)))
1969
+ );
1970
+ border-style: var(
1971
+ --_show-border,
1972
+ var(--_ctm-mob-dn-et-pe-br-se, var(--_ctm-tab-dn-et-pe-br-se, var(--_ctm-dn-et-pe-br-se)))
1973
+ );
1974
+ border-width: var(
1975
+ --_show-border,
1976
+ var(--_ctm-mob-dn-et-pe-br-wh, var(--_ctm-tab-dn-et-pe-br-wh, var(--_ctm-dn-et-pe-br-wh)))
1977
+ );
1978
+ border-radius: var(
1979
+ --_ctm-mob-dn-et-pe-br-rs,
1980
+ var(--_ctm-tab-dn-et-pe-br-rs, var(--_ctm-dn-et-pe-br-rs))
1981
+ );
1982
+
1983
+ box-shadow: var(
1984
+ --_show-shadow,
1985
+ var(--_ctm-mob-dn-et-pe-sw-ae, var(--_ctm-tab-dn-et-pe-sw-ae, var(--_ctm-dn-et-pe-sw-ae)))
1986
+ var(
1987
+ --_ctm-mob-dn-et-pe-sw-br,
1988
+ var(--_ctm-tab-dn-et-pe-sw-br, var(--_ctm-dn-et-pe-sw-br))
1989
+ )
1990
+ var(
1991
+ --_ctm-mob-dn-et-pe-sw-sd,
1992
+ var(--_ctm-tab-dn-et-pe-sw-sd, var(--_ctm-dn-et-pe-sw-sd))
1993
+ )
1994
+ var(
1995
+ --_ctm-mob-dn-et-pe-sw-cr,
1996
+ var(--_ctm-tab-dn-et-pe-sw-cr, var(--_ctm-dn-et-pe-sw-cr))
1997
+ )
1998
+ );
1999
+ }
2000
+ }
2001
+ .price-text-element {
2002
+ // background-color: var(--_ctm-dn-bd-cr, var(--_tst-dn-bd-cr));
2003
+ padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
2004
+ display: flex;
2005
+ flex-direction: column;
2006
+ gap: 10px;
2007
+ --_sf-cd-gp: calc(var(--_sf-gp) * 0.5);
2008
+ // row-gap: var(--_sf-gp);
2009
+ width: 100%;
2010
+ // height: 100%;
2011
+ border-color: var(--_ctm-mob-dn-br-cr, var(--_ctm-tab-dn-br-cr, var(--_ctm-dn-br-cr)));
2012
+ border-style: var(--_ctm-mob-dn-br-se, var(--_ctm-tab-dn-br-se, var(--_ctm-dn-br-se)));
2013
+ border-width: var(--_ctm-mob-dn-br-wh, var(--_ctm-tab-dn-br-wh, var(--_ctm-dn-br-wh)));
2014
+ border-radius: var(--_ctm-mob-dn-br-rs, var(--_ctm-tab-dn-br-rs, var(--_ctm-dn-br-rs)));
2015
+ box-shadow: var(
2016
+ --_show-shadow,
2017
+ var(--_ctm-mob-dn-sw-ae, var(--_ctm-tab-dn-sw-ae, var(--_ctm-dn-sw-ae)))
2018
+ var(--_ctm-mob-dn-sw-br, var(--_ctm-tab-dn-sw-br, var(--_ctm-dn-sw-br)))
2019
+ var(--_ctm-mob-dn-sw-sd, var(--_ctm-tab-dn-sw-sd, var(--_ctm-dn-sw-sd)))
2020
+ var(--_ctm-mob-dn-sw-cr, var(--_ctm-tab-dn-sw-cr, var(--_ctm-dn-sw-cr)))
2021
+ );
2022
+
2023
+ // transform: scale(var(--_ctm-dn-zm-ie));
2024
+ scale: var(--_ctm-mob-dn-zm-ie, var(--_ctm-tab-dn-zm-ie, var(--_ctm-dn-zm-ie)));
2025
+
2026
+ &[data-flip-x="true"] {
2027
+ transform: scaleX(-1);
2028
+ }
2029
+ &[data-flip-y="true"] {
2030
+ transform: scaleY(-1);
2031
+ }
2032
+ .meta_text_element {
2033
+ color: green;
2034
+ //styleName: Text md/Medium;
2035
+ font-family: Lato;
2036
+ font-size: 16px;
2037
+ font-weight: 500;
2038
+ line-height: 24px;
2039
+ text-align: left;
2040
+ text-underline-position: from-font;
2041
+ text-decoration-skip-ink: none;
2042
+ }
2043
+ .price-container {
2044
+ display: flex;
2045
+ align-items: center;
2046
+ gap: 5px;
2047
+ .element-container {
2048
+ display: flex;
2049
+ align-items: flex-start;
2050
+ gap: 10px;
2051
+ flex-direction: column;
2052
+ width: 100%;
2053
+ }
1577
2054
 
1578
2055
  // Tooltip SCSS Style Starts Here -
1579
2056
  .tooltipWrapper {
@@ -1732,7 +2209,8 @@
1732
2209
  --_ctm-mob-dn-pt-tx-cr,
1733
2210
  var(--_ctm-tab-dn-pt-tx-cr, var(--_ctm-dn-pt-tx-cr))
1734
2211
  );
1735
- font-family: var(
2212
+ font-family:
2213
+ var(
1736
2214
  --_ctm-mob-dn-pt-tx-ft-fy,
1737
2215
  var(--_ctm-tab-dn-pt-tx-ft-fy, var(--_ctm-dn-pt-tx-ft-fy))
1738
2216
  ),
@@ -1827,7 +2305,8 @@
1827
2305
  --_ctm-mob-dn-pt-sg-pe-cr,
1828
2306
  var(--_ctm-tab-dn-pt-sg-pe-cr, var(--_ctm-dn-pt-sg-pe-cr))
1829
2307
  );
1830
- font-family: var(
2308
+ font-family:
2309
+ var(
1831
2310
  --_ctm-mob-dn-pt-sg-pe-ft-fy,
1832
2311
  var(--_ctm-tab-dn-pt-sg-pe-ft-fy, var(--_ctm-dn-pt-sg-pe-ft-fy))
1833
2312
  ),
@@ -1922,7 +2401,8 @@
1922
2401
  --_ctm-mob-dn-et-pe-cr,
1923
2402
  var(--_ctm-tab-dn-et-pe-cr, var(--_ctm-dn-et-pe-cr))
1924
2403
  );
1925
- font-family: var(
2404
+ font-family:
2405
+ var(
1926
2406
  --_ctm-mob-dn-et-pe-ft-fy,
1927
2407
  var(--_ctm-tab-dn-et-pe-ft-fy, var(--_ctm-dn-et-pe-ft-fy))
1928
2408
  ),