@sc-360-v2/storefront-cms-library 0.4.55 → 0.4.57

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 (151) hide show
  1. package/dist/add-existing-form.scss +66 -66
  2. package/dist/add-order.scss +377 -377
  3. package/dist/add-products-tab copy.scss +1132 -1132
  4. package/dist/allocations.scss +1603 -1603
  5. package/dist/amount-estimator.scss +1083 -1083
  6. package/dist/animation-control.scss +23 -23
  7. package/dist/badge.scss +388 -388
  8. package/dist/brand-basic-elements.scss +292 -292
  9. package/dist/brand.scss +93 -93
  10. package/dist/breadcrumbs.scss +802 -802
  11. package/dist/builder.js +1 -1
  12. package/dist/bulk-order-pad.scss +677 -677
  13. package/dist/bulk-variant-picker copy.scss +1121 -1121
  14. package/dist/bulk-variant-picker.scss +3294 -3294
  15. package/dist/bundle copy.scss +2805 -2805
  16. package/dist/bundle.scss +2383 -2383
  17. package/dist/bundleDetails copy.scss +1431 -1431
  18. package/dist/button copy.scss +271 -271
  19. package/dist/button.scss +292 -292
  20. package/dist/buy-for-tab-container.scss +90 -90
  21. package/dist/buy-for-tabs-container-item.scss +80 -80
  22. package/dist/buyForHeaders.scss +6718 -6718
  23. package/dist/cart-products-sidebar.scss +211 -211
  24. package/dist/cart-summary.scss +2728 -2728
  25. package/dist/cart-wrapper.scss +127 -127
  26. package/dist/cartGrouping.scss +89 -89
  27. package/dist/category-groups-element.scss +138 -138
  28. package/dist/category.scss +73 -73
  29. package/dist/categoryDetails.scss +61 -61
  30. package/dist/categoryWidget.scss +34 -34
  31. package/dist/checkbox-radio.scss +124 -124
  32. package/dist/code-temp.scss +58 -58
  33. package/dist/colorpicker_v2.scss +52 -52
  34. package/dist/common-element.scss +35 -35
  35. package/dist/confirm-modal.scss +351 -351
  36. package/dist/confirmationModal.scss +139 -139
  37. package/dist/contact-us.scss +105 -105
  38. package/dist/container.scss +114 -114
  39. package/dist/countdown.scss +751 -751
  40. package/dist/coupon.scss +1254 -1254
  41. package/dist/custom-fonts.scss +100 -100
  42. package/dist/customization-tree.scss +160 -160
  43. package/dist/default-dropdown.scss +240 -240
  44. package/dist/editCartItem.scss +111 -111
  45. package/dist/embed-temp.scss +72 -72
  46. package/dist/embroider-preview-element.scss +94 -94
  47. package/dist/embroider-template-1-v2.scss +937 -937
  48. package/dist/embroider-template-1.scss +482 -482
  49. package/dist/embroidery.scss +213 -213
  50. package/dist/employee-bulk-order.scss +4057 -4057
  51. package/dist/emtpy-templates.scss +165 -165
  52. package/dist/faq.scss +564 -564
  53. package/dist/fb-dropdown.scss +125 -125
  54. package/dist/filter-results.scss +323 -323
  55. package/dist/flex-text-editor.scss +271 -271
  56. package/dist/form-preview.scss +290 -290
  57. package/dist/form-zindex-module.scss +24 -24
  58. package/dist/gallery-slider-temp.scss +1234 -1234
  59. package/dist/global-styles.scss +86 -86
  60. package/dist/grid.scss +119 -119
  61. package/dist/hotspot.scss +397 -397
  62. package/dist/icon-library.scss +74 -74
  63. package/dist/image-for-product.scss +21 -21
  64. package/dist/image-temp.scss +168 -168
  65. package/dist/item-stock.scss +87 -87
  66. package/dist/layouter-item.scss +89 -89
  67. package/dist/layouter-pro-item.scss +80 -80
  68. package/dist/layouter-pro.scss +88 -88
  69. package/dist/light-box-v2.scss +105 -105
  70. package/dist/lightbox.scss +78 -78
  71. package/dist/line.scss +166 -166
  72. package/dist/loader.scss +37 -37
  73. package/dist/map.scss +962 -962
  74. package/dist/marchandiserSets.scss +60 -60
  75. package/dist/mega-menu-container.scss +99 -99
  76. package/dist/mega-menu.scss +838 -838
  77. package/dist/menu-item.scss +19 -19
  78. package/dist/menu.scss +162 -162
  79. package/dist/modal.scss +2267 -2267
  80. package/dist/multi-select-dropdown.scss +282 -282
  81. package/dist/my-wishlist.scss +17 -17
  82. package/dist/option-bar.scss +845 -845
  83. package/dist/order-processing.scss +61 -61
  84. package/dist/overflow-module.scss +63 -63
  85. package/dist/past-orders.scss +975 -975
  86. package/dist/payment-methods.scss +289 -289
  87. package/dist/pickup-locations.scss +1167 -1167
  88. package/dist/position-module.scss +95 -95
  89. package/dist/prefix-list.scss +86 -86
  90. package/dist/product-actions copy.scss +2765 -2765
  91. package/dist/product-actions.scss +2286 -2286
  92. package/dist/product-basic-elements.scss +770 -770
  93. package/dist/product-customizations.scss +149 -149
  94. package/dist/product-highlights copy.scss +217 -217
  95. package/dist/product-highlights.scss +311 -311
  96. package/dist/product-image copy.scss +787 -787
  97. package/dist/product-image.scss +12 -0
  98. package/dist/product-inventory.scss +1378 -1378
  99. package/dist/product-options.scss +1144 -1144
  100. package/dist/product-price.scss +2598 -2598
  101. package/dist/product-promotions.scss +2759 -2759
  102. package/dist/product.scss +97 -97
  103. package/dist/productDetails.scss +70 -70
  104. package/dist/quick-links.scss +552 -552
  105. package/dist/quick-order-pad.scss +237 -237
  106. package/dist/quota-details.scss +263 -263
  107. package/dist/quotes.scss +737 -737
  108. package/dist/repeater copy.scss +635 -635
  109. package/dist/repeater-grid-toggle.scss +58 -58
  110. package/dist/repeater-item.scss +90 -90
  111. package/dist/request-for-quotes.scss +746 -746
  112. package/dist/responsive-behaviour.scss +29 -29
  113. package/dist/rfqs.scss +736 -736
  114. package/dist/scroll.scss +222 -222
  115. package/dist/search-results-heading.scss +279 -279
  116. package/dist/shareCartSideBar.scss +254 -254
  117. package/dist/shipping-estimator.scss +41 -41
  118. package/dist/shipping-payments.scss +2467 -2467
  119. package/dist/simple-list.scss +259 -259
  120. package/dist/skeleton.scss +74 -74
  121. package/dist/social.scss +276 -276
  122. package/dist/sort.scss +89 -89
  123. package/dist/spotlight.scss +1663 -1663
  124. package/dist/stack.scss +129 -129
  125. package/dist/static-text.scss +52 -52
  126. package/dist/stockStatus.scss +64 -64
  127. package/dist/store-locations.scss +1398 -1398
  128. package/dist/sub-category.scss +74 -74
  129. package/dist/submit-quote.scss +275 -275
  130. package/dist/tab-container-item.scss +80 -80
  131. package/dist/tab-container.scss +89 -89
  132. package/dist/tab-v2.scss +583 -583
  133. package/dist/table-common.scss +506 -506
  134. package/dist/table.scss +685 -685
  135. package/dist/tabs.scss +395 -395
  136. package/dist/text-temp-v2.scss +139 -139
  137. package/dist/text-temp.scss +109 -109
  138. package/dist/toaster.scss +350 -350
  139. package/dist/toggle-button.scss +32 -32
  140. package/dist/transform-properties-module.scss +20 -20
  141. package/dist/types/builder/tools/element-edit/layouter.d.ts +2 -0
  142. package/dist/uom-selector.scss +1169 -1169
  143. package/dist/user-elements copy.scss +1437 -1437
  144. package/dist/variant-picker.scss +2384 -2384
  145. package/dist/video.scss +476 -476
  146. package/dist/volume-pricing copy 2.scss +1468 -1468
  147. package/dist/volume-pricing copy.scss +1077 -1077
  148. package/dist/volume-pricing.scss +1175 -1175
  149. package/dist/widget.scss +148 -148
  150. package/dist/wishlist-overlay.scss +48 -48
  151. package/package.json +1 -1
package/dist/product-price.scss CHANGED
@@ -1,2598 +1,2598 @@
1
- @use "sass:map";
2
- @use "sass:list";
3
- @use "./functions.scss";
4
-
5
- [data-div-type="element"] {
6
- &[data-element-type="productPrice"] {
7
- // width: var(--_lt-wh);
8
- // height: var(--_lt-ht);
9
- // margin: var(--_lt-mn);
10
- // padding: var(--_lt-pg);
11
- // width: var(--_ctm-lt-wh, var(--_tst-lt-wh));
12
- // width: var(--_sf-nw-wh, var(--_tst-lt-wh));
13
- // width: var(--_ctm-ele-nw-wh-vl);
14
- //width: var(--_sf-el-wh-st-mx, calc(1% * var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))));
15
- //margin: var(--_ctm-lt-mn, --_tst-lt-mn);
16
- width: var(
17
- --_sf-el-wh-st-mx,
18
- calc(
19
- 1% * var(--_ctm-mob-ele-nw-wh-vl, var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl)))
20
- )
21
- );
22
- margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));
23
- // height: var(--_ctm-lt-ht, var(--_tst-lt-ht));
24
- // height: ;
25
- // aspect-ratio: 1 / var(--_sf-aspect-ratio);
26
- // --_aspect-ratio: calc(
27
- // 1 * (var(--_ctm-lt-ht, var(--_tst-lt-ht)) / var(--_ctm-lt-wh, var(--_tst-lt-wh)))
28
- // );
29
-
30
- & > .wrapper {
31
- width: 100%;
32
- // height: 100%;
33
- }
34
- &[data-show-shadow="false"] {
35
- --_show-shadow: none;
36
- }
37
- .text-element {
38
- // background: #6d96e4;
39
- // padding: 10px;
40
- // font-weight: 600;
41
- // color: rgba(75, 69, 70, 1);
42
- color: var(--Gray-900, #101828);
43
- font-family: "Hanken Grotesk";
44
- font-size: 32px;
45
- font-style: normal;
46
- font-weight: 700;
47
- line-height: 150%; /* 48px */
48
- }
49
-
50
- .product-price {
51
- display: flex;
52
- flex-direction: column;
53
- width: 100%;
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
-
72
- box-shadow: var(
73
- --_show-shadow,
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)))
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
- }
92
-
93
- @keyframes shimmer {
94
- 0% {
95
- background-position: -200% 0;
96
- }
97
- 100% {
98
- background-position: 200% 0;
99
- }
100
- }
101
-
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: var(
105
- --_ctm-mob-dn-pt-pe-ft-fy,
106
- var(--_ctm-tab-dn-pt-pe-ft-fy, var(--_ctm-dn-pt-pe-ft-fy))
107
- );
108
- font-size: var(
109
- --_ctm-mob-dn-pt-pe-ft-se,
110
- var(--_ctm-tab-dn-pt-pe-ft-se, var(--_ctm-dn-pt-pe-ft-se))
111
- );
112
- font-weight: var(
113
- --_ctm-mob-dn-pt-pe-ft-wt,
114
- var(--_ctm-tab-dn-pt-pe-ft-wt, var(--_ctm-dn-pt-pe-ft-wt))
115
- );
116
- font-style: var(
117
- --_ctm-mob-dn-pt-pe-ft-se-ic,
118
- var(--_ctm-tab-dn-pt-pe-ft-se-ic, var(--_ctm-dn-pt-pe-ft-se-ic))
119
- );
120
- text-align: var(
121
- --_ctm-mob-dn-pt-pe-tt-an,
122
- var(--_ctm-tab-dn-pt-pe-tt-an, var(--_ctm-dn-pt-pe-tt-an))
123
- );
124
- letter-spacing: var(
125
- --_ctm-mob-dn-pt-pe-lr-sg,
126
- var(--_ctm-tab-dn-pt-pe-lr-sg, var(--_ctm-dn-pt-pe-lr-sg))
127
- );
128
- line-height: var(
129
- --_ctm-mob-dn-pt-pe-le-ht,
130
- var(--_ctm-tab-dn-pt-pe-le-ht, var(--_ctm-dn-pt-pe-le-ht))
131
- );
132
- text-decoration: var(
133
- --_ctm-mob-dn-pt-pe-ue,
134
- var(--_ctm-tab-dn-pt-pe-ue, var(--_ctm-dn-pt-pe-ue))
135
- );
136
- }
137
- .strike-price {
138
- color: var(
139
- --_ctm-mob-dn-pt-pe-cr-dc,
140
- var(--_ctm-tab-dn-pt-pe-cr-dc, var(--_ctm-dn-pt-pe-cr-dc))
141
- );
142
- font-family: var(
143
- --_sf-hr-ff,
144
- var(
145
- --_ctm-mob-dn-pt-pe-ft-fy-dc,
146
- var(--_ctm-tab-dn-pt-pe-ft-fy-dc, var(--_ctm-dn-pt-pe-ft-fy-dc))
147
- )
148
- );
149
- font-size: var(
150
- --_ctm-mob-dn-pt-pe-ft-se-dc,
151
- var(--_ctm-tab-dn-pt-pe-ft-se-dc, var(--_ctm-dn-pt-pe-ft-se-dc))
152
- );
153
- font-weight: var(
154
- --_ctm-mob-dn-pt-pe-ft-wt-dc,
155
- var(--_ctm-tab-dn-pt-pe-ft-wt-dc, var(--_ctm-dn-pt-pe-ft-wt-dc))
156
- );
157
- font-style: var(
158
- --_ctm-mob-dn-pt-pe-ft-se-ic-dc,
159
- var(--_ctm-tab-dn-pt-pe-ft-se-ic-dc, var(--_ctm-dn-pt-pe-ft-se-ic-dc))
160
- );
161
- text-align: var(
162
- --_ctm-mob-dn-pt-pe-tt-an-dc,
163
- var(--_ctm-tab-dn-pt-pe-tt-an-dc, var(--_ctm-dn-pt-pe-tt-an-dc))
164
- );
165
- letter-spacing: var(
166
- --_ctm-mob-dn-pt-pe-lr-sg-dc,
167
- var(--_ctm-tab-dn-pt-pe-lr-sg-dc, var(--_ctm-dn-pt-pe-lr-sg-dc))
168
- );
169
- line-height: var(
170
- --_ctm-mob-dn-pt-pe-le-ht-dc,
171
- var(--_ctm-tab-dn-pt-pe-le-ht-dc, var(--_ctm-dn-pt-pe-le-ht-dc))
172
- );
173
- text-decoration: var(
174
- --_ctm-mob-dn-pt-pe-ue-dc,
175
- var(--_ctm-tab-dn-pt-pe-ue-dc, var(--_ctm-dn-pt-pe-ue-dc))
176
- );
177
- }
178
-
179
- .code-span {
180
- background-color: var(
181
- --_ctm-mob-dn-cy-ce-se-bd-cr,
182
- var(--_ctm-tab-dn-cy-ce-se-bd-cr, var(--_ctm-dn-cy-ce-se-bd-cr))
183
- );
184
- color: var(
185
- --_ctm-mob-dn-cy-ce-se-cr,
186
- var(--_ctm-tab-dn-cy-ce-se-cr, var(--_ctm-dn-cy-ce-se-cr))
187
- );
188
- font-family: var(
189
- --_ctm-mob-dn-cy-ce-se-ft-fy,
190
- var(--_ctm-tab-dn-cy-ce-se-ft-fy, var(--_ctm-dn-cy-ce-se-ft-fy))
191
- );
192
- font-size: var(
193
- --_ctm-mob-dn-cy-ce-se-ft-se,
194
- var(--_ctm-tab-dn-cy-ce-se-ft-se, var(--_ctm-dn-cy-ce-se-ft-se))
195
- );
196
- font-weight: var(
197
- --_ctm-mob-dn-cy-ce-se-ft-wt,
198
- var(--_ctm-tab-dn-cy-ce-se-ft-wt, var(--_ctm-dn-cy-ce-se-ft-wt))
199
- );
200
- font-style: var(
201
- --_ctm-mob-dn-cy-ce-se-ft-se-ic,
202
- var(--_ctm-tab-dn-cy-ce-se-ft-se-ic, var(--_ctm-dn-cy-ce-se-ft-se-ic))
203
- );
204
- text-align: var(
205
- --_ctm-mob-dn-cy-ce-se-tt-an,
206
- var(--_ctm-tab-dn-cy-ce-se-tt-an, var(--_ctm-dn-cy-ce-se-tt-an))
207
- );
208
- letter-spacing: var(
209
- --_ctm-mob-dn-cy-ce-se-lr-sg,
210
- var(--_ctm-tab-dn-cy-ce-se-lr-sg, var(--_ctm-dn-cy-ce-se-lr-sg))
211
- );
212
- line-height: var(
213
- --_ctm-mob-dn-cy-ce-se-le-ht,
214
- var(--_ctm-tab-dn-cy-ce-se-le-ht, var(--_ctm-dn-cy-ce-se-le-ht))
215
- );
216
- text-decoration: var(
217
- --_ctm-mob-dn-cy-ce-se-ue,
218
- var(--_ctm-tab-dn-cy-ce-se-ue, var(--_ctm-dn-cy-ce-se-ue))
219
- );
220
-
221
- border-color: var(
222
- --_show-border,
223
- var(
224
- --_ctm-mob-dn-cy-ce-se-br-cr,
225
- var(--_ctm-tab-dn-cy-ce-se-br-cr, var(--_ctm-dn-cy-ce-se-br-cr))
226
- )
227
- );
228
- border-style: var(
229
- --_show-border,
230
- var(
231
- --_ctm-mob-dn-cy-ce-se-br-se,
232
- var(--_ctm-tab-dn-cy-ce-se-br-se, var(--_ctm-dn-cy-ce-se-br-se))
233
- )
234
- );
235
- border-width: var(
236
- --_show-border,
237
- var(
238
- --_ctm-mob-dn-cy-ce-se-br-wh,
239
- var(--_ctm-tab-dn-cy-ce-se-br-wh, var(--_ctm-dn-cy-ce-se-br-wh))
240
- )
241
- );
242
- border-radius: var(
243
- --_ctm-mob-dn-cy-ce-se-br-rs,
244
- var(--_ctm-tab-dn-cy-ce-se-br-rs, var(--_ctm-dn-cy-ce-se-br-rs))
245
- );
246
-
247
- box-shadow: var(
248
- --_show-shadow,
249
- var(
250
- --_ctm-mob-dn-cy-ce-se-sw-ae,
251
- var(--_ctm-tab-dn-cy-ce-se-sw-ae, var(--_ctm-dn-cy-ce-se-sw-ae))
252
- )
253
- var(
254
- --_ctm-mob-dn-cy-ce-se-sw-br,
255
- var(--_ctm-tab-dn-cy-ce-se-sw-br, var(--_ctm-dn-cy-ce-se-sw-br))
256
- )
257
- var(
258
- --_ctm-mob-dn-cy-ce-se-sw-sd,
259
- var(--_ctm-tab-dn-cy-ce-se-sw-sd, var(--_ctm-dn-cy-ce-se-sw-sd))
260
- )
261
- var(
262
- --_ctm-mob-dn-cy-ce-se-sw-cr,
263
- var(--_ctm-tab-dn-cy-ce-se-sw-cr, var(--_ctm-dn-cy-ce-se-sw-cr))
264
- )
265
- );
266
- }
267
-
268
- .uom-span {
269
- background-color: var(
270
- --_ctm-mob-dn-um-se-bd-cr,
271
- var(--_ctm-tab-dn-um-se-bd-cr, var(--_ctm-dn-um-se-bd-cr))
272
- );
273
- color: var(--_ctm-mob-dn-um-se-cr, var(--_ctm-tab-dn-um-se-cr, var(--_ctm-dn-um-se-cr)));
274
- font-family: var(
275
- --_ctm-mob-dn-um-se-ft-fy,
276
- var(--_ctm-tab-dn-um-se-ft-fy, var(--_ctm-dn-um-se-ft-fy))
277
- );
278
- font-size: var(
279
- --_ctm-mob-dn-um-se-ft-se,
280
- var(--_ctm-tab-dn-um-se-ft-se, var(--_ctm-dn-um-se-ft-se))
281
- );
282
- font-weight: var(
283
- --_ctm-mob-dn-um-se-ft-wt,
284
- var(--_ctm-tab-dn-um-se-ft-wt, var(--_ctm-dn-um-se-ft-wt))
285
- );
286
- font-style: var(
287
- --_ctm-mob-dn-um-se-ft-se-ic,
288
- var(--_ctm-tab-dn-um-se-ft-se-ic, var(--_ctm-dn-um-se-ft-se-ic))
289
- );
290
- text-align: var(
291
- --_ctm-mob-dn-um-se-tt-an,
292
- var(--_ctm-tab-dn-um-se-tt-an, var(--_ctm-dn-um-se-tt-an))
293
- );
294
- letter-spacing: var(
295
- --_ctm-mob-dn-um-se-lr-sg,
296
- var(--_ctm-tab-dn-um-se-lr-sg, var(--_ctm-dn-um-se-lr-sg))
297
- );
298
- line-height: var(
299
- --_ctm-mob-dn-um-se-le-ht,
300
- var(--_ctm-tab-dn-um-se-le-ht, var(--_ctm-dn-um-se-le-ht))
301
- );
302
- text-decoration: var(
303
- --_ctm-mob-dn-um-se-ue,
304
- var(--_ctm-tab-dn-um-se-ue, var(--_ctm-dn-um-se-ue))
305
- );
306
-
307
- border-color: var(
308
- --_show-border,
309
- var(--_ctm-mob-dn-um-se-br-cr, var(--_ctm-tab-dn-um-se-br-cr, var(--_ctm-dn-um-se-br-cr)))
310
- );
311
- border-style: var(
312
- --_show-border,
313
- var(--_ctm-mob-dn-um-se-br-se, var(--_ctm-tab-dn-um-se-br-se, var(--_ctm-dn-um-se-br-se)))
314
- );
315
- border-width: var(
316
- --_show-border,
317
- var(--_ctm-mob-dn-um-se-br-wh, var(--_ctm-tab-dn-um-se-br-wh, var(--_ctm-dn-um-se-br-wh)))
318
- );
319
- border-radius: var(
320
- --_ctm-mob-dn-um-se-br-rs,
321
- var(--_ctm-tab-dn-um-se-br-rs, var(--_ctm-dn-um-se-br-rs))
322
- );
323
-
324
- box-shadow: var(
325
- --_show-shadow,
326
- var(--_ctm-mob-dn-um-se-sw-ae, var(--_ctm-tab-dn-um-se-sw-ae, var(--_ctm-dn-um-se-sw-ae)))
327
- var(
328
- --_ctm-mob-dn-um-se-sw-br,
329
- var(--_ctm-tab-dn-um-se-sw-br, var(--_ctm-dn-um-se-sw-br))
330
- )
331
- var(
332
- --_ctm-mob-dn-um-se-sw-sd,
333
- var(--_ctm-tab-dn-um-se-sw-sd, var(--_ctm-dn-um-se-sw-sd))
334
- )
335
- var(
336
- --_ctm-mob-dn-um-se-sw-cr,
337
- var(--_ctm-tab-dn-um-se-sw-cr, var(--_ctm-dn-um-se-sw-cr))
338
- )
339
- );
340
- }
341
- .denominations_container {
342
- // font-size: 16px;
343
- display: flex;
344
- flex-direction: column;
345
- // gap: 6px;
346
- // padding-bottom: 14px;
347
-
348
- background-color: var(
349
- --_ctm-mob-dn-gt-cd-cd-wr-bd-cr,
350
- var(--_ctm-tab-dn-gt-cd-cd-wr-bd-cr, var(--_ctm-dn-gt-cd-cd-wr-bd-cr))
351
- );
352
- border-color: var(
353
- --_ctm-mob-dn-gt-cd-cd-wr-br-cr,
354
- var(--_ctm-tab-dn-gt-cd-cd-wr-br-cr, var(--_ctm-dn-gt-cd-cd-wr-br-cr))
355
- );
356
- border-radius: var(
357
- --_ctm-mob-dn-gt-cd-cd-wr-br-rs,
358
- var(--_ctm-tab-dn-gt-cd-cd-wr-br-rs, var(--_ctm-dn-gt-cd-cd-wr-br-rs))
359
- );
360
- border-style: var(
361
- --_ctm-mob-dn-gt-cd-cd-wr-br-se,
362
- var(--_ctm-tab-dn-gt-cd-cd-wr-br-se, var(--_ctm-dn-gt-cd-cd-wr-br-se))
363
- );
364
- border-width: var(
365
- --_ctm-mob-dn-gt-cd-cd-wr-br-wh,
366
- var(--_ctm-tab-dn-gt-cd-cd-wr-br-wh, var(--_ctm-dn-gt-cd-cd-wr-br-wh))
367
- );
368
- box-shadow: var(
369
- --_ctm-mob-dn-gt-cd-cd-wr-sw-ae,
370
- var(--_ctm-tab-dn-gt-cd-cd-wr-sw-ae, var(--_ctm-dn-gt-cd-cd-wr-sw-ae))
371
- )
372
- var(
373
- --_ctm-mob-dn-gt-cd-cd-wr-sw-br,
374
- var(--_ctm-tab-dn-gt-cd-cd-wr-sw-br, var(--_ctm-dn-gt-cd-cd-wr-sw-br))
375
- )
376
- var(
377
- --_ctm-mob-dn-gt-cd-cd-wr-sw-sd,
378
- var(--_ctm-tab-dn-gt-cd-cd-wr-sw-sd, var(--_ctm-dn-gt-cd-cd-wr-sw-sd))
379
- )
380
- var(
381
- --_ctm-mob-dn-gt-cd-cd-wr-sw-cr,
382
- var(--_ctm-tab-dn-gt-cd-cd-wr-sw-cr, var(--_ctm-dn-gt-cd-cd-wr-sw-cr))
383
- );
384
- padding: var(
385
- --_ctm-mob-dn-gt-cd-cd-wr-pg,
386
- var(--_ctm-tab-dn-gt-cd-cd-wr-pg, var(--_ctm-dn-gt-cd-cd-wr-pg))
387
- );
388
- gap: var(
389
- --_ctm-mob-dn-gt-cd-cd-wr-im-gp,
390
- var(--_ctm-tab-dn-gt-cd-cd-wr-im-gp, var(--_ctm-dn-gt-cd-cd-wr-im-gp))
391
- );
392
- .denominations_title {
393
- // margin-bottom: 4px;
394
- // font-size: 16px;
395
- // color: #000000;
396
- // font-weight: 500;
397
- // line-height: 150%;
398
- font-family: var(
399
- --_ctm-mob-dn-gt-cd-ts-ft-fy,
400
- var(--_ctm-tab-dn-gt-cd-ts-ft-fy, var(--_ctm-dn-gt-cd-ts-ft-fy))
401
- );
402
- color: var(
403
- --_ctm-mob-dn-gt-cd-ts-cr,
404
- var(--_ctm-tab-dn-gt-cd-ts-cr, var(--_ctm-dn-gt-cd-ts-cr))
405
- );
406
- font-weight: var(
407
- --_ctm-mob-dn-gt-cd-ts-ft-wt,
408
- var(--_ctm-tab-dn-gt-cd-ts-ft-wt, var(--_ctm-dn-gt-cd-ts-ft-wt))
409
- );
410
- font-size: var(
411
- --_ctm-mob-dn-gt-cd-ts-ft-se,
412
- var(--_ctm-tab-dn-gt-cd-ts-ft-se, var(--_ctm-dn-gt-cd-ts-ft-se))
413
- );
414
- text-decoration: var(
415
- --_ctm-mob-dn-gt-cd-ts-ue,
416
- var(--_ctm-tab-dn-gt-cd-ts-ue, var(--_ctm-dn-gt-cd-ts-ue))
417
- );
418
- letter-spacing: var(
419
- --_ctm-mob-dn-gt-cd-ts-lr-sg,
420
- var(--_ctm-tab-dn-gt-cd-ts-lr-sg, var(--_ctm-dn-gt-cd-ts-lr-sg))
421
- );
422
- line-height: var(
423
- --_ctm-mob-dn-gt-cd-ts-le-ht,
424
- var(--_ctm-tab-dn-gt-cd-ts-le-ht, var(--_ctm-dn-gt-cd-ts-le-ht))
425
- );
426
- font-style: var(
427
- --_ctm-mob-dn-gt-cd-ts-ft-se-ic,
428
- var(--_ctm-tab-dn-gt-cd-ts-ft-se-ic, var(--_ctm-dn-gt-cd-ts-ft-se-ic))
429
- );
430
- text-align: var(
431
- --_ctm-mob-dn-gt-cd-ts-tt-an,
432
- var(--_ctm-tab-dn-gt-cd-ts-tt-an, var(--_ctm-dn-gt-cd-ts-tt-an))
433
- );
434
- }
435
- .denominations_grid {
436
- display: flex;
437
- // gap: 8px;
438
- flex-wrap: wrap;
439
- margin-top: 12px;
440
- flex-direction: row;
441
- gap: 12px;
442
- // gap: var(
443
- // --_ctm-mob-dn-gt-cd-cd-dt-se-im-gp,
444
- // var(--_ctm-tab-dn-gt-cd-cd-dt-se-im-gp, var(--_ctm-dn-gt-cd-cd-dt-se-im-gp))
445
- // );
446
- .amount_btn {
447
- transition: color 0.3s ease;
448
- cursor: pointer;
449
- display: flex;
450
- align-items: center;
451
- justify-content: center;
452
- // padding: 4px;
453
- min-width: 20px;
454
- min-height: 20px;
455
- box-sizing: content-box;
456
- // font-size: 16px;
457
- // font-weight: 600;
458
- // line-height: 150%;
459
- // background-color: #ffffff;
460
- // border: 1px solid #d6d6d6;
461
- background-color: var(
462
- --_ctm-mob-dn-gt-cd-cd-dt-se-bd-cr,
463
- var(--_ctm-tab-dn-gt-cd-cd-dt-se-bd-cr, var(--_ctm-dn-gt-cd-cd-dt-se-bd-cr))
464
- );
465
- font-family: var(
466
- --_ctm-mob-dn-gt-cd-cd-dt-se-ft-fy,
467
- var(--_ctm-tab-dn-gt-cd-cd-dt-se-ft-fy, var(--_ctm-dn-gt-cd-cd-dt-se-ft-fy))
468
- );
469
- color: var(
470
- --_ctm-mob-dn-gt-cd-cd-dt-se-cr,
471
- var(--_ctm-tab-dn-gt-cd-cd-dt-se-cr, var(--_ctm-dn-gt-cd-cd-dt-se-cr))
472
- );
473
- font-weight: var(
474
- --_ctm-mob-dn-gt-cd-cd-dt-se-ft-wt,
475
- var(--_ctm-tab-dn-gt-cd-cd-dt-se-ft-wt, var(--_ctm-dn-gt-cd-cd-dt-se-ft-wt))
476
- );
477
- font-size: var(
478
- --_ctm-mob-dn-gt-cd-cd-dt-se-ft-se,
479
- var(--_ctm-tab-dn-gt-cd-cd-dt-se-ft-se, var(--_ctm-dn-gt-cd-cd-dt-se-ft-se))
480
- );
481
- text-decoration: var(
482
- --_ctm-mob-dn-gt-cd-cd-dt-se-ue,
483
- var(--_ctm-tab-dn-gt-cd-cd-dt-se-ue, var(--_ctm-dn-gt-cd-cd-dt-se-ue))
484
- );
485
- letter-spacing: var(
486
- --_ctm-mob-dn-gt-cd-cd-dt-se-lr-sg,
487
- var(--_ctm-tab-dn-gt-cd-cd-dt-se-lr-sg, var(--_ctm-dn-gt-cd-cd-dt-se-lr-sg))
488
- );
489
- line-height: var(
490
- --_ctm-mob-dn-gt-cd-cd-dt-se-le-ht,
491
- var(--_ctm-tab-dn-gt-cd-cd-dt-se-le-ht, var(--_ctm-dn-gt-cd-cd-dt-se-le-ht))
492
- );
493
- font-style: var(
494
- --_ctm-mob-dn-gt-cd-cd-dt-se-ft-se-ic,
495
- var(--_ctm-tab-dn-gt-cd-cd-dt-se-ft-se-ic, var(--_ctm-dn-gt-cd-cd-dt-se-ft-se-ic))
496
- );
497
- text-align: var(
498
- --_ctm-mob-dn-gt-cd-cd-dt-se-tt-an,
499
- var(--_ctm-tab-dn-gt-cd-cd-dt-se-tt-an, var(--_ctm-dn-gt-cd-cd-dt-se-tt-an))
500
- );
501
- border-color: var(
502
- --_ctm-mob-dn-gt-cd-cd-dt-se-br-cr,
503
- var(--_ctm-tab-dn-gt-cd-cd-dt-se-br-cr, var(--_ctm-dn-gt-cd-cd-dt-se-br-cr))
504
- );
505
- border-radius: var(
506
- --_ctm-mob-dn-gt-cd-cd-dt-se-br-rs,
507
- var(--_ctm-tab-dn-gt-cd-cd-dt-se-br-rs, var(--_ctm-dn-gt-cd-cd-dt-se-br-rs))
508
- );
509
- border-style: var(
510
- --_ctm-mob-dn-gt-cd-cd-dt-se-br-se,
511
- var(--_ctm-tab-dn-gt-cd-cd-dt-se-br-se, var(--_ctm-dn-gt-cd-cd-dt-se-br-se))
512
- );
513
- border-width: var(
514
- --_ctm-mob-dn-gt-cd-cd-dt-se-br-wh,
515
- var(--_ctm-tab-dn-gt-cd-cd-dt-se-br-wh, var(--_ctm-dn-gt-cd-cd-dt-se-br-wh))
516
- );
517
- box-shadow: var(
518
- --_ctm-mob-dn-gt-cd-cd-dt-se-sw-ae,
519
- var(--_ctm-tab-dn-gt-cd-cd-dt-se-sw-ae, var(--_ctm-dn-gt-cd-cd-dt-se-sw-ae))
520
- )
521
- var(
522
- --_ctm-mob-dn-gt-cd-cd-dt-se-sw-br,
523
- var(--_ctm-tab-dn-gt-cd-cd-dt-se-sw-br, var(--_ctm-dn-gt-cd-cd-dt-se-sw-br))
524
- )
525
- var(
526
- --_ctm-mob-dn-gt-cd-cd-dt-se-sw-sd,
527
- var(--_ctm-tab-dn-gt-cd-cd-dt-se-sw-sd, var(--_ctm-dn-gt-cd-cd-dt-se-sw-sd))
528
- )
529
- var(
530
- --_ctm-mob-dn-gt-cd-cd-dt-se-sw-cr,
531
- var(--_ctm-tab-dn-gt-cd-cd-dt-se-sw-cr, var(--_ctm-dn-gt-cd-cd-dt-se-sw-cr))
532
- );
533
- padding: var(
534
- --_ctm-mob-dn-gt-cd-cd-dt-se-pg,
535
- var(--_ctm-tab-dn-gt-cd-cd-dt-se-pg, var(--_ctm-dn-gt-cd-cd-dt-se-pg))
536
- );
537
- &.active {
538
- background-color: var(
539
- --_ctm-mob-dn-gt-cd-cd-sd-se-bd-cr,
540
- var(--_ctm-tab-dn-gt-cd-cd-sd-se-bd-cr, var(--_ctm-dn-gt-cd-cd-sd-se-bd-cr))
541
- );
542
- font-family: var(
543
- --_ctm-mob-dn-gt-cd-cd-sd-se-ft-fy,
544
- var(--_ctm-tab-dn-gt-cd-cd-sd-se-ft-fy, var(--_ctm-dn-gt-cd-cd-sd-se-ft-fy))
545
- );
546
- color: var(
547
- --_ctm-mob-dn-gt-cd-cd-sd-se-cr,
548
- var(--_ctm-tab-dn-gt-cd-cd-sd-se-cr, var(--_ctm-dn-gt-cd-cd-sd-se-cr))
549
- );
550
- font-weight: var(
551
- --_ctm-mob-dn-gt-cd-cd-sd-se-ft-wt,
552
- var(--_ctm-tab-dn-gt-cd-cd-sd-se-ft-wt, var(--_ctm-dn-gt-cd-cd-sd-se-ft-wt))
553
- );
554
- font-size: var(
555
- --_ctm-mob-dn-gt-cd-cd-sd-se-ft-se,
556
- var(--_ctm-tab-dn-gt-cd-cd-sd-se-ft-se, var(--_ctm-dn-gt-cd-cd-sd-se-ft-se))
557
- );
558
- text-decoration: var(
559
- --_ctm-mob-dn-gt-cd-cd-sd-se-ue,
560
- var(--_ctm-tab-dn-gt-cd-cd-sd-se-ue, var(--_ctm-dn-gt-cd-cd-sd-se-ue))
561
- );
562
- letter-spacing: var(
563
- --_ctm-mob-dn-gt-cd-cd-sd-se-lr-sg,
564
- var(--_ctm-tab-dn-gt-cd-cd-sd-se-lr-sg, var(--_ctm-dn-gt-cd-cd-sd-se-lr-sg))
565
- );
566
- line-height: var(
567
- --_ctm-mob-dn-gt-cd-cd-sd-se-le-ht,
568
- var(--_ctm-tab-dn-gt-cd-cd-sd-se-le-ht, var(--_ctm-dn-gt-cd-cd-sd-se-le-ht))
569
- );
570
- font-style: var(
571
- --_ctm-mob-dn-gt-cd-cd-sd-se-ft-se-ic,
572
- var(--_ctm-tab-dn-gt-cd-cd-sd-se-ft-se-ic, var(--_ctm-dn-gt-cd-cd-sd-se-ft-se-ic))
573
- );
574
- text-align: var(
575
- --_ctm-mob-dn-gt-cd-cd-sd-se-tt-an,
576
- var(--_ctm-tab-dn-gt-cd-cd-sd-se-tt-an, var(--_ctm-dn-gt-cd-cd-sd-se-tt-an))
577
- );
578
- border-color: var(
579
- --_ctm-mob-dn-gt-cd-cd-sd-se-br-cr,
580
- var(--_ctm-tab-dn-gt-cd-cd-sd-se-br-cr, var(--_ctm-dn-gt-cd-cd-sd-se-br-cr))
581
- );
582
- border-radius: var(
583
- --_ctm-mob-dn-gt-cd-cd-sd-se-br-rs,
584
- var(--_ctm-tab-dn-gt-cd-cd-sd-se-br-rs, var(--_ctm-dn-gt-cd-cd-sd-se-br-rs))
585
- );
586
- border-style: var(
587
- --_ctm-mob-dn-gt-cd-cd-sd-se-br-se,
588
- var(--_ctm-tab-dn-gt-cd-cd-sd-se-br-se, var(--_ctm-dn-gt-cd-cd-sd-se-br-se))
589
- );
590
- border-width: var(
591
- --_ctm-mob-dn-gt-cd-cd-sd-se-br-wh,
592
- var(--_ctm-tab-dn-gt-cd-cd-sd-se-br-wh, var(--_ctm-dn-gt-cd-cd-sd-se-br-wh))
593
- );
594
- box-shadow: var(
595
- --_ctm-mob-dn-gt-cd-cd-sd-se-sw-ae,
596
- var(--_ctm-tab-dn-gt-cd-cd-sd-se-sw-ae, var(--_ctm-dn-gt-cd-cd-sd-se-sw-ae))
597
- )
598
- var(
599
- --_ctm-mob-dn-gt-cd-cd-sd-se-sw-br,
600
- var(--_ctm-tab-dn-gt-cd-cd-sd-se-sw-br, var(--_ctm-dn-gt-cd-cd-sd-se-sw-br))
601
- )
602
- var(
603
- --_ctm-mob-dn-gt-cd-cd-sd-se-sw-sd,
604
- var(--_ctm-tab-dn-gt-cd-cd-sd-se-sw-sd, var(--_ctm-dn-gt-cd-cd-sd-se-sw-sd))
605
- )
606
- var(
607
- --_ctm-mob-dn-gt-cd-cd-sd-se-sw-cr,
608
- var(--_ctm-tab-dn-gt-cd-cd-sd-se-sw-cr, var(--_ctm-dn-gt-cd-cd-sd-se-sw-cr))
609
- );
610
- padding: var(
611
- --_ctm-mob-dn-gt-cd-cd-sd-se-pg,
612
- var(--_ctm-tab-dn-gt-cd-cd-sd-se-pg, var(--_ctm-dn-gt-cd-cd-sd-se-pg))
613
- );
614
- // background-color: #f5f5f5;
615
- // border: 1px solid #3e4784;
616
- // color: #000080;
617
- }
618
- }
619
- }
620
- .custom_amount_container {
621
- display: flex;
622
- flex-direction: column;
623
- gap: 8px;
624
- .custom_amount_label {
625
- font-family: var(
626
- --_ctm-mob-dn-gt-cd-ls-ft-fy,
627
- var(--_ctm-tab-dn-gt-cd-ls-ft-fy, var(--_ctm-dn-gt-cd-ls-ft-fy))
628
- );
629
- color: var(
630
- --_ctm-mob-dn-gt-cd-ls-cr,
631
- var(--_ctm-tab-dn-gt-cd-ls-cr, var(--_ctm-dn-gt-cd-ls-cr))
632
- );
633
- font-weight: var(
634
- --_ctm-mob-dn-gt-cd-ls-ft-wt,
635
- var(--_ctm-tab-dn-gt-cd-ls-ft-wt, var(--_ctm-dn-gt-cd-ls-ft-wt))
636
- );
637
- font-size: var(
638
- --_ctm-mob-dn-gt-cd-ls-ft-se,
639
- var(--_ctm-tab-dn-gt-cd-ls-ft-se, var(--_ctm-dn-gt-cd-ls-ft-se))
640
- );
641
- text-decoration: var(
642
- --_ctm-mob-dn-gt-cd-ls-ue,
643
- var(--_ctm-tab-dn-gt-cd-ls-ue, var(--_ctm-dn-gt-cd-ls-ue))
644
- );
645
- letter-spacing: var(
646
- --_ctm-mob-dn-gt-cd-ls-lr-sg,
647
- var(--_ctm-tab-dn-gt-cd-ls-lr-sg, var(--_ctm-dn-gt-cd-ls-lr-sg))
648
- );
649
- line-height: var(
650
- --_ctm-mob-dn-gt-cd-ls-le-ht,
651
- var(--_ctm-tab-dn-gt-cd-ls-le-ht, var(--_ctm-dn-gt-cd-ls-le-ht))
652
- );
653
- font-style: var(
654
- --_ctm-mob-dn-gt-cd-ls-ft-se-ic,
655
- var(--_ctm-tab-dn-gt-cd-ls-ft-se-ic, var(--_ctm-dn-gt-cd-ls-ft-se-ic))
656
- );
657
- text-align: var(
658
- --_ctm-mob-dn-gt-cd-ls-tt-an,
659
- var(--_ctm-tab-dn-gt-cd-ls-tt-an, var(--_ctm-dn-gt-cd-ls-tt-an))
660
- );
661
- padding: var(
662
- --_ctm-mob-dn-gt-cd-ls-pg,
663
- var(--_ctm-tab-dn-gt-cd-ls-pg, var(--_ctm-dn-gt-cd-ls-pg))
664
- );
665
- }
666
- .custom_amount_input {
667
- height: 40px;
668
- display: flex;
669
- position: relative;
670
- // gap: 6px;
671
- align-items: center;
672
- // border-radius: 4px;
673
- // background: #fff;
674
- // border: 1px solid #d0d5dd;
675
- // padding: 8px 12px;
676
- background-color: var(
677
- --_ctm-mob-dn-gt-cd-is-bd-cr,
678
- var(--_ctm-tab-dn-gt-cd-is-bd-cr, var(--_ctm-dn-gt-cd-is-bd-cr))
679
- );
680
-
681
- border-color: var(
682
- --_ctm-mob-dn-gt-cd-is-br-cr,
683
- var(--_ctm-tab-dn-gt-cd-is-br-cr, var(--_ctm-dn-gt-cd-is-br-cr))
684
- );
685
- border-radius: var(
686
- --_ctm-mob-dn-gt-cd-is-br-rs,
687
- var(--_ctm-tab-dn-gt-cd-is-br-rs, var(--_ctm-dn-gt-cd-is-br-rs))
688
- );
689
- border-style: var(
690
- --_ctm-mob-dn-gt-cd-is-br-se,
691
- var(--_ctm-tab-dn-gt-cd-is-br-se, var(--_ctm-dn-gt-cd-is-br-se))
692
- );
693
- border-width: var(
694
- --_ctm-mob-dn-gt-cd-is-br-wh,
695
- var(--_ctm-tab-dn-gt-cd-is-br-wh, var(--_ctm-dn-gt-cd-is-br-wh))
696
- );
697
- padding: var(
698
- --_ctm-mob-dn-gt-cd-is-pg,
699
- var(--_ctm-tab-dn-gt-cd-is-pg, var(--_ctm-dn-gt-cd-is-pg))
700
- );
701
- // width: 220px;
702
- transition:
703
- background-color 0.2s,
704
- color 0.2s,
705
- border-color 0.2s,
706
- box-shadow 0.2s;
707
- .svg_icon {
708
- color: var(--_gray-700);
709
- font-weight: 500;
710
- font-size: 14px;
711
- line-height: 24px;
712
- white-space: nowrap;
713
- }
714
- input {
715
- color: var(--_gray-700);
716
- margin-top: 2px;
717
- &::placeholder {
718
- font-family: var(
719
- --_ctm-mob-dn-gt-cd-is-ft-fy,
720
- var(--_ctm-tab-dn-gt-cd-is-ft-fy, var(--_ctm-dn-gt-cd-is-ft-fy))
721
- );
722
- color: var(
723
- --_ctm-mob-dn-gt-cd-is-cr,
724
- var(--_ctm-tab-dn-gt-cd-is-cr, var(--_ctm-dn-gt-cd-is-cr))
725
- );
726
- font-weight: var(
727
- --_ctm-mob-dn-gt-cd-is-ft-wt,
728
- var(--_ctm-tab-dn-gt-cd-is-ft-wt, var(--_ctm-dn-gt-cd-is-ft-wt))
729
- );
730
- font-size: var(
731
- --_ctm-mob-dn-gt-cd-is-ft-se,
732
- var(--_ctm-tab-dn-gt-cd-is-ft-se, var(--_ctm-dn-gt-cd-is-ft-se))
733
- );
734
- text-decoration: var(
735
- --_ctm-mob-dn-gt-cd-is-ue,
736
- var(--_ctm-tab-dn-gt-cd-is-ue, var(--_ctm-dn-gt-cd-is-ue))
737
- );
738
- letter-spacing: var(
739
- --_ctm-mob-dn-gt-cd-is-lr-sg,
740
- var(--_ctm-tab-dn-gt-cd-is-lr-sg, var(--_ctm-dn-gt-cd-is-lr-sg))
741
- );
742
- line-height: var(
743
- --_ctm-mob-dn-gt-cd-is-le-ht,
744
- var(--_ctm-tab-dn-gt-cd-is-le-ht, var(--_ctm-dn-gt-cd-is-le-ht))
745
- );
746
- font-style: var(
747
- --_ctm-mob-dn-gt-cd-is-ft-se-ic,
748
- var(--_ctm-tab-dn-gt-cd-is-ft-se-ic, var(--_ctm-dn-gt-cd-is-ft-se-ic))
749
- );
750
- text-align: var(
751
- --_ctm-mob-dn-gt-cd-is-tt-an,
752
- var(--_ctm-tab-dn-gt-cd-is-tt-an, var(--_ctm-dn-gt-cd-is-tt-an))
753
- );
754
- // color: var(--_gray-500);
755
- // font-weight: 500;
756
- // font-size: 14px;
757
- // line-height: 24px;
758
- }
759
- }
760
- &:focus-within {
761
- outline: 0 none;
762
- outline-offset: 0;
763
- border-radius: 4px;
764
- box-shadow:
765
- 0px 1px 2px rgba(16, 24, 40, 0.05),
766
- 0px 0px 0px 2px var(--_primary-100);
767
- border: 1px solid var(--_primary-300);
768
- }
769
- }
770
- }
771
- .delivery_details_container {
772
- display: flex;
773
- flex-direction: column;
774
- gap: var(
775
- --_ctm-mob-dn-gt-cd-cd-wr-im-gp,
776
- var(--_ctm-tab-dn-gt-cd-cd-wr-im-gp, var(--_ctm-dn-gt-cd-cd-wr-im-gp))
777
- );
778
- .delivery_details_title {
779
- display: inline-block;
780
- // margin-top: 8px;
781
- // margin-bottom: 4px;
782
- // font-size: 16px;
783
- // color: #000000;
784
- // font-weight: 500;
785
- // line-height: 150%;
786
- font-family: var(
787
- --_ctm-mob-dn-gt-cd-ts-ft-fy,
788
- var(--_ctm-tab-dn-gt-cd-ts-ft-fy, var(--_ctm-dn-gt-cd-ts-ft-fy))
789
- );
790
- color: var(
791
- --_ctm-mob-dn-gt-cd-ts-cr,
792
- var(--_ctm-tab-dn-gt-cd-ts-cr, var(--_ctm-dn-gt-cd-ts-cr))
793
- );
794
- font-weight: var(
795
- --_ctm-mob-dn-gt-cd-ts-ft-wt,
796
- var(--_ctm-tab-dn-gt-cd-ts-ft-wt, var(--_ctm-dn-gt-cd-ts-ft-wt))
797
- );
798
- font-size: var(
799
- --_ctm-mob-dn-gt-cd-ts-ft-se,
800
- var(--_ctm-tab-dn-gt-cd-ts-ft-se, var(--_ctm-dn-gt-cd-ts-ft-se))
801
- );
802
- text-decoration: var(
803
- --_ctm-mob-dn-gt-cd-ts-ue,
804
- var(--_ctm-tab-dn-gt-cd-ts-ue, var(--_ctm-dn-gt-cd-ts-ue))
805
- );
806
- letter-spacing: var(
807
- --_ctm-mob-dn-gt-cd-ts-lr-sg,
808
- var(--_ctm-tab-dn-gt-cd-ts-lr-sg, var(--_ctm-dn-gt-cd-ts-lr-sg))
809
- );
810
- line-height: var(
811
- --_ctm-mob-dn-gt-cd-ts-le-ht,
812
- var(--_ctm-tab-dn-gt-cd-ts-le-ht, var(--_ctm-dn-gt-cd-ts-le-ht))
813
- );
814
- font-style: var(
815
- --_ctm-mob-dn-gt-cd-ts-ft-se-ic,
816
- var(--_ctm-tab-dn-gt-cd-ts-ft-se-ic, var(--_ctm-dn-gt-cd-ts-ft-se-ic))
817
- );
818
- text-align: var(
819
- --_ctm-mob-dn-gt-cd-ts-tt-an,
820
- var(--_ctm-tab-dn-gt-cd-ts-tt-an, var(--_ctm-dn-gt-cd-ts-tt-an))
821
- );
822
- }
823
- .horizontal_line {
824
- // border: 1px solid #d0d5dd;
825
- // display: block;
826
- // width: 100%;
827
- // border-style: var(--_ctm-dn-gt-cd-dr-dr-se);
828
- // border-color: var(--_ctm-dn-gt-cd-dr-dr-cr);
829
- // border-width: var(--_ctm-dn-gt-cd-dr-dr-wh);
830
- border-top: var(--_ctm-dn-gt-cd-dr-dr-wh) var(--_ctm-dn-gt-cd-dr-dr-se)
831
- var(--_ctm-dn-gt-cd-dr-dr-cr);
832
- }
833
- .input_container {
834
- display: flex;
835
- flex-direction: column;
836
- gap: 8px;
837
- // margin-bottom: 12px;
838
-
839
- &:last-child {
840
- margin-bottom: 0;
841
- }
842
- label {
843
- display: block;
844
- font-family: var(
845
- --_ctm-mob-dn-gt-cd-ls-ft-fy,
846
- var(--_ctm-tab-dn-gt-cd-ls-ft-fy, var(--_ctm-dn-gt-cd-ls-ft-fy))
847
- );
848
- color: var(
849
- --_ctm-mob-dn-gt-cd-ls-cr,
850
- var(--_ctm-tab-dn-gt-cd-ls-cr, var(--_ctm-dn-gt-cd-ls-cr))
851
- );
852
- font-weight: var(
853
- --_ctm-mob-dn-gt-cd-ls-ft-wt,
854
- var(--_ctm-tab-dn-gt-cd-ls-ft-wt, var(--_ctm-dn-gt-cd-ls-ft-wt))
855
- );
856
- font-size: var(
857
- --_ctm-mob-dn-gt-cd-ls-ft-se,
858
- var(--_ctm-tab-dn-gt-cd-ls-ft-se, var(--_ctm-dn-gt-cd-ls-ft-se))
859
- );
860
- text-decoration: var(
861
- --_ctm-mob-dn-gt-cd-ls-ue,
862
- var(--_ctm-tab-dn-gt-cd-ls-ue, var(--_ctm-dn-gt-cd-ls-ue))
863
- );
864
- letter-spacing: var(
865
- --_ctm-mob-dn-gt-cd-ls-lr-sg,
866
- var(--_ctm-tab-dn-gt-cd-ls-lr-sg, var(--_ctm-dn-gt-cd-ls-lr-sg))
867
- );
868
- line-height: var(
869
- --_ctm-mob-dn-gt-cd-ls-le-ht,
870
- var(--_ctm-tab-dn-gt-cd-ls-le-ht, var(--_ctm-dn-gt-cd-ls-le-ht))
871
- );
872
- font-style: var(
873
- --_ctm-mob-dn-gt-cd-ls-ft-se-ic,
874
- var(--_ctm-tab-dn-gt-cd-ls-ft-se-ic, var(--_ctm-dn-gt-cd-ls-ft-se-ic))
875
- );
876
- text-align: var(
877
- --_ctm-mob-dn-gt-cd-ls-tt-an,
878
- var(--_ctm-tab-dn-gt-cd-ls-tt-an, var(--_ctm-dn-gt-cd-ls-tt-an))
879
- );
880
- padding: var(
881
- --_ctm-mob-dn-gt-cd-ls-pg,
882
- var(--_ctm-tab-dn-gt-cd-ls-pg, var(--_ctm-dn-gt-cd-ls-pg))
883
- );
884
- // color: var(--_gray-700);
885
- // font-weight: 400;
886
- // font-size: 14px;
887
- // line-height: 20px;
888
- }
889
- .message_text {
890
- resize: none;
891
- // background-color: var(--_base-white);
892
- // padding: 5px 12px;
893
- // border: 1px solid var(--_gray-300);
894
- // border-radius: 4px;
895
- background-color: var(
896
- --_ctm-mob-dn-gt-cd-is-bd-cr,
897
- var(--_ctm-tab-dn-gt-cd-is-bd-cr, var(--_ctm-dn-gt-cd-is-bd-cr))
898
- );
899
-
900
- border-color: var(
901
- --_ctm-mob-dn-gt-cd-is-br-cr,
902
- var(--_ctm-tab-dn-gt-cd-is-br-cr, var(--_ctm-dn-gt-cd-is-br-cr))
903
- );
904
- border-radius: var(
905
- --_ctm-mob-dn-gt-cd-is-br-rs,
906
- var(--_ctm-tab-dn-gt-cd-is-br-rs, var(--_ctm-dn-gt-cd-is-br-rs))
907
- );
908
- border-style: var(
909
- --_ctm-mob-dn-gt-cd-is-br-se,
910
- var(--_ctm-tab-dn-gt-cd-is-br-se, var(--_ctm-dn-gt-cd-is-br-se))
911
- );
912
- border-width: var(
913
- --_ctm-mob-dn-gt-cd-is-br-wh,
914
- var(--_ctm-tab-dn-gt-cd-is-br-wh, var(--_ctm-dn-gt-cd-is-br-wh))
915
- );
916
- padding: var(
917
- --_ctm-mob-dn-gt-cd-is-pg,
918
- var(--_ctm-tab-dn-gt-cd-is-pg, var(--_ctm-dn-gt-cd-is-pg))
919
- );
920
- // margin-bottom: 8px;
921
- transition:
922
- background-color 0.2s,
923
- color 0.2s,
924
- border-color 0.2s,
925
- box-shadow 0.2s;
926
- height: 90px;
927
- &::placeholder {
928
- // color: var(--_gray-500);
929
- // font-weight: 500;
930
- // font-size: 14px;
931
- // line-height: 24px;
932
- font-family: var(
933
- --_ctm-mob-dn-gt-cd-is-ft-fy,
934
- var(--_ctm-tab-dn-gt-cd-is-ft-fy, var(--_ctm-dn-gt-cd-is-ft-fy))
935
- );
936
- color: var(
937
- --_ctm-mob-dn-gt-cd-is-cr,
938
- var(--_ctm-tab-dn-gt-cd-is-cr, var(--_ctm-dn-gt-cd-is-cr))
939
- );
940
- font-weight: var(
941
- --_ctm-mob-dn-gt-cd-is-ft-wt,
942
- var(--_ctm-tab-dn-gt-cd-is-ft-wt, var(--_ctm-dn-gt-cd-is-ft-wt))
943
- );
944
- font-size: var(
945
- --_ctm-mob-dn-gt-cd-is-ft-se,
946
- var(--_ctm-tab-dn-gt-cd-is-ft-se, var(--_ctm-dn-gt-cd-is-ft-se))
947
- );
948
- text-decoration: var(
949
- --_ctm-mob-dn-gt-cd-is-ue,
950
- var(--_ctm-tab-dn-gt-cd-is-ue, var(--_ctm-dn-gt-cd-is-ue))
951
- );
952
- letter-spacing: var(
953
- --_ctm-mob-dn-gt-cd-is-lr-sg,
954
- var(--_ctm-tab-dn-gt-cd-is-lr-sg, var(--_ctm-dn-gt-cd-is-lr-sg))
955
- );
956
- line-height: var(
957
- --_ctm-mob-dn-gt-cd-is-le-ht,
958
- var(--_ctm-tab-dn-gt-cd-is-le-ht, var(--_ctm-dn-gt-cd-is-le-ht))
959
- );
960
- font-style: var(
961
- --_ctm-mob-dn-gt-cd-is-ft-se-ic,
962
- var(--_ctm-tab-dn-gt-cd-is-ft-se-ic, var(--_ctm-dn-gt-cd-is-ft-se-ic))
963
- );
964
- text-align: var(
965
- --_ctm-mob-dn-gt-cd-is-tt-an,
966
- var(--_ctm-tab-dn-gt-cd-is-tt-an, var(--_ctm-dn-gt-cd-is-tt-an))
967
- );
968
- }
969
- &:focus {
970
- outline: 0 none;
971
- outline-offset: 0;
972
- border-radius: 4px;
973
- box-shadow:
974
- 0px 1px 2px rgba(16, 24, 40, 0.05),
975
- 0px 0px 0px 2px var(--_primary-100);
976
- border: 1px solid var(--_primary-300);
977
- }
978
- }
979
- input {
980
- // background-color: var(--_base-white);
981
- // padding: 8px 12px;
982
- // border: 1px solid var(--_gray-300);
983
- // border-radius: 4px;
984
- height: 40px;
985
-
986
- background-color: var(
987
- --_ctm-mob-dn-gt-cd-is-bd-cr,
988
- var(--_ctm-tab-dn-gt-cd-is-bd-cr, var(--_ctm-dn-gt-cd-is-bd-cr))
989
- );
990
-
991
- border-color: var(
992
- --_ctm-mob-dn-gt-cd-is-br-cr,
993
- var(--_ctm-tab-dn-gt-cd-is-br-cr, var(--_ctm-dn-gt-cd-is-br-cr))
994
- );
995
- border-radius: var(
996
- --_ctm-mob-dn-gt-cd-is-br-rs,
997
- var(--_ctm-tab-dn-gt-cd-is-br-rs, var(--_ctm-dn-gt-cd-is-br-rs))
998
- );
999
- border-style: var(
1000
- --_ctm-mob-dn-gt-cd-is-br-se,
1001
- var(--_ctm-tab-dn-gt-cd-is-br-se, var(--_ctm-dn-gt-cd-is-br-se))
1002
- );
1003
- border-width: var(
1004
- --_ctm-mob-dn-gt-cd-is-br-wh,
1005
- var(--_ctm-tab-dn-gt-cd-is-br-wh, var(--_ctm-dn-gt-cd-is-br-wh))
1006
- );
1007
- padding: var(
1008
- --_ctm-mob-dn-gt-cd-is-pg,
1009
- var(--_ctm-tab-dn-gt-cd-is-pg, var(--_ctm-dn-gt-cd-is-pg))
1010
- );
1011
-
1012
- transition:
1013
- background-color 0.2s,
1014
- color 0.2s,
1015
- border-color 0.2s,
1016
- box-shadow 0.2s;
1017
- &::placeholder {
1018
- // color: var(--_gray-500);
1019
- // font-weight: 500;
1020
- // font-size: 14px;
1021
- // line-height: 24px;
1022
- font-family: var(
1023
- --_ctm-mob-dn-gt-cd-is-ft-fy,
1024
- var(--_ctm-tab-dn-gt-cd-is-ft-fy, var(--_ctm-dn-gt-cd-is-ft-fy))
1025
- );
1026
- color: var(
1027
- --_ctm-mob-dn-gt-cd-is-cr,
1028
- var(--_ctm-tab-dn-gt-cd-is-cr, var(--_ctm-dn-gt-cd-is-cr))
1029
- );
1030
- font-weight: var(
1031
- --_ctm-mob-dn-gt-cd-is-ft-wt,
1032
- var(--_ctm-tab-dn-gt-cd-is-ft-wt, var(--_ctm-dn-gt-cd-is-ft-wt))
1033
- );
1034
- font-size: var(
1035
- --_ctm-mob-dn-gt-cd-is-ft-se,
1036
- var(--_ctm-tab-dn-gt-cd-is-ft-se, var(--_ctm-dn-gt-cd-is-ft-se))
1037
- );
1038
- text-decoration: var(
1039
- --_ctm-mob-dn-gt-cd-is-ue,
1040
- var(--_ctm-tab-dn-gt-cd-is-ue, var(--_ctm-dn-gt-cd-is-ue))
1041
- );
1042
- letter-spacing: var(
1043
- --_ctm-mob-dn-gt-cd-is-lr-sg,
1044
- var(--_ctm-tab-dn-gt-cd-is-lr-sg, var(--_ctm-dn-gt-cd-is-lr-sg))
1045
- );
1046
- line-height: var(
1047
- --_ctm-mob-dn-gt-cd-is-le-ht,
1048
- var(--_ctm-tab-dn-gt-cd-is-le-ht, var(--_ctm-dn-gt-cd-is-le-ht))
1049
- );
1050
- font-style: var(
1051
- --_ctm-mob-dn-gt-cd-is-ft-se-ic,
1052
- var(--_ctm-tab-dn-gt-cd-is-ft-se-ic, var(--_ctm-dn-gt-cd-is-ft-se-ic))
1053
- );
1054
- text-align: var(
1055
- --_ctm-mob-dn-gt-cd-is-tt-an,
1056
- var(--_ctm-tab-dn-gt-cd-is-tt-an, var(--_ctm-dn-gt-cd-is-tt-an))
1057
- );
1058
- }
1059
- &:focus {
1060
- outline: 0 none;
1061
- outline-offset: 0;
1062
- border-radius: 4px;
1063
- box-shadow:
1064
- 0px 1px 2px rgba(16, 24, 40, 0.05),
1065
- 0px 0px 0px 2px var(--_primary-100);
1066
- border: 1px solid var(--_primary-300);
1067
- }
1068
- }
1069
- .error_text {
1070
- font-size: 12px;
1071
- color: var(--_error-500);
1072
- }
1073
- }
1074
- }
1075
- }
1076
- }
1077
- .product-actual-price-container {
1078
- .product-actual-discount {
1079
- .discount-percentage {
1080
- background-color: var(
1081
- --_ctm-mob-dn-dt-bd-cr,
1082
- var(--_ctm-tab-dn-dt-bd-cr, var(--_ctm-dn-dt-bd-cr))
1083
- );
1084
- color: var(--_ctm-mob-dn-dt-cr, var(--_ctm-tab-dn-dt-cr, var(--_ctm-dn-dt-cr)));
1085
- font-family: var(
1086
- --_ctm-mob-dn-dt-ft-fy,
1087
- var(--_ctm-tab-dn-dt-ft-fy, var(--_ctm-dn-dt-ft-fy))
1088
- );
1089
- font-size: var(
1090
- --_ctm-mob-dn-dt-ft-se,
1091
- var(--_ctm-tab-dn-dt-ft-se, var(--_ctm-dn-dt-ft-se))
1092
- );
1093
- font-weight: var(
1094
- --_ctm-mob-dn-dt-ft-wt,
1095
- var(--_ctm-tab-dn-dt-ft-wt, var(--_ctm-dn-dt-ft-wt))
1096
- );
1097
- font-style: var(
1098
- --_ctm-mob-dn-dt-ft-se-ic,
1099
- var(--_ctm-tab-dn-dt-ft-se-ic, var(--_ctm-dn-dt-ft-se-ic))
1100
- );
1101
- text-align: var(
1102
- --_ctm-mob-dn-dt-tt-an,
1103
- var(--_ctm-tab-dn-dt-tt-an, var(--_ctm-dn-dt-tt-an))
1104
- );
1105
- letter-spacing: var(
1106
- --_ctm-mob-dn-dt-lr-sg,
1107
- var(--_ctm-tab-dn-dt-lr-sg, var(--_ctm-dn-dt-lr-sg))
1108
- );
1109
- line-height: var(
1110
- --_ctm-mob-dn-dt-le-ht,
1111
- var(--_ctm-tab-dn-dt-le-ht, var(--_ctm-dn-dt-le-ht))
1112
- );
1113
- text-decoration: var(--_ctm-mob-dn-dt-ue, var(--_ctm-tab-dn-dt-ue, var(--_ctm-dn-dt-ue)));
1114
-
1115
- border-color: var(
1116
- --_show-border,
1117
- var(--_ctm-mob-dn-dt-br-cr, var(--_ctm-tab-dn-dt-br-cr, var(--_ctm-dn-dt-br-cr)))
1118
- );
1119
- border-style: var(
1120
- --_show-border,
1121
- var(--_ctm-mob-dn-dt-br-se, var(--_ctm-tab-dn-dt-br-se, var(--_ctm-dn-dt-br-se)))
1122
- );
1123
- border-width: var(
1124
- --_show-border,
1125
- var(--_ctm-mob-dn-dt-br-wh, var(--_ctm-tab-dn-dt-br-wh, var(--_ctm-dn-dt-br-wh)))
1126
- );
1127
- border-radius: var(
1128
- --_ctm-mob-dn-dt-br-rs,
1129
- var(--_ctm-tab-dn-dt-br-rs, var(--_ctm-dn-dt-br-rs))
1130
- );
1131
-
1132
- box-shadow: var(
1133
- --_show-shadow,
1134
- var(--_ctm-mob-dn-dt-sw-ae, var(--_ctm-tab-dn-dt-sw-ae, var(--_ctm-dn-dt-sw-ae)))
1135
- var(--_ctm-mob-dn-dt-sw-br, var(--_ctm-tab-dn-dt-sw-br, var(--_ctm-dn-dt-sw-br)))
1136
- var(--_ctm-mob-dn-dt-sw-sd, var(--_ctm-tab-dn-dt-sw-sd, var(--_ctm-dn-dt-sw-sd)))
1137
- var(--_ctm-mob-dn-dt-sw-cr, var(--_ctm-tab-dn-dt-sw-cr, var(--_ctm-dn-dt-sw-cr)))
1138
- );
1139
- }
1140
-
1141
- .discount-value-percentage {
1142
- background-color: var(
1143
- --_ctm-mob-dn-dt-ve-bd-cr,
1144
- var(--_ctm-tab-dn-dt-ve-bd-cr, var(--_ctm-dn-dt-ve-bd-cr))
1145
- );
1146
- color: var(--_ctm-mob-dn-dt-ve-cr, var(--_ctm-tab-dn-dt-ve-cr, var(--_ctm-dn-dt-ve-cr)));
1147
- font-family: var(
1148
- --_ctm-mob-dn-dt-ve-ft-fy,
1149
- var(--_ctm-tab-dn-dt-ve-ft-fy, var(--_ctm-dn-dt-ve-ft-fy))
1150
- );
1151
- font-size: var(
1152
- --_ctm-mob-dn-dt-ve-ft-se,
1153
- var(--_ctm-tab-dn-dt-ve-ft-se, var(--_ctm-dn-dt-ve-ft-se))
1154
- );
1155
- font-weight: var(
1156
- --_ctm-mob-dn-dt-ve-ft-wt,
1157
- var(--_ctm-tab-dn-dt-ve-ft-wt, var(--_ctm-dn-dt-ve-ft-wt))
1158
- );
1159
- font-style: var(
1160
- --_ctm-mob-dn-dt-ve-ft-se-ic,
1161
- var(--_ctm-tab-dn-dt-ve-ft-se-ic, var(--_ctm-dn-dt-ve-ft-se-ic))
1162
- );
1163
- text-align: var(
1164
- --_ctm-mob-dn-dt-ve-tt-an,
1165
- var(--_ctm-tab-dn-dt-ve-tt-an, var(--_ctm-dn-dt-ve-tt-an))
1166
- );
1167
- letter-spacing: var(
1168
- --_ctm-mob-dn-dt-ve-lr-sg,
1169
- var(--_ctm-tab-dn-dt-ve-lr-sg, var(--_ctm-dn-dt-ve-lr-sg))
1170
- );
1171
- line-height: var(
1172
- --_ctm-mob-dn-dt-ve-le-ht,
1173
- var(--_ctm-tab-dn-dt-ve-le-ht, var(--_ctm-dn-dt-ve-le-ht))
1174
- );
1175
- text-decoration: var(
1176
- --_ctm-mob-dn-dt-ve-ue,
1177
- var(--_ctm-tab-dn-dt-ve-ue, var(--_ctm-dn-dt-ve-ue))
1178
- );
1179
-
1180
- border-color: var(
1181
- --_show-border,
1182
- var(
1183
- --_ctm-mob-dn-dt-ve-br-cr,
1184
- var(--_ctm-tab-dn-dt-ve-br-cr, var(--_ctm-dn-dt-ve-br-cr))
1185
- )
1186
- );
1187
- border-style: var(
1188
- --_show-border,
1189
- var(
1190
- --_ctm-mob-dn-dt-ve-br-se,
1191
- var(--_ctm-tab-dn-dt-ve-br-se, var(--_ctm-dn-dt-ve-br-se))
1192
- )
1193
- );
1194
- border-width: var(
1195
- --_show-border,
1196
- var(
1197
- --_ctm-mob-dn-dt-ve-br-wh,
1198
- var(--_ctm-tab-dn-dt-ve-br-wh, var(--_ctm-dn-dt-ve-br-wh))
1199
- )
1200
- );
1201
- border-radius: var(
1202
- --_ctm-mob-dn-dt-ve-br-rs,
1203
- var(--_ctm-tab-dn-dt-ve-br-rs, var(--_ctm-dn-dt-ve-br-rs))
1204
- );
1205
-
1206
- box-shadow: var(
1207
- --_show-shadow,
1208
- var(
1209
- --_ctm-mob-dn-dt-ve-sw-ae,
1210
- var(--_ctm-tab-dn-dt-ve-sw-ae, var(--_ctm-dn-dt-ve-sw-ae))
1211
- )
1212
- var(
1213
- --_ctm-mob-dn-dt-ve-sw-br,
1214
- var(--_ctm-tab-dn-dt-ve-sw-br, var(--_ctm-dn-dt-ve-sw-br))
1215
- )
1216
- var(
1217
- --_ctm-mob-dn-dt-ve-sw-sd,
1218
- var(--_ctm-tab-dn-dt-ve-sw-sd, var(--_ctm-dn-dt-ve-sw-sd))
1219
- )
1220
- var(
1221
- --_ctm-mob-dn-dt-ve-sw-cr,
1222
- var(--_ctm-tab-dn-dt-ve-sw-cr, var(--_ctm-dn-dt-ve-sw-cr))
1223
- )
1224
- );
1225
- }
1226
- }
1227
- .product-actual-price {
1228
- .actual-price-span {
1229
- background-color: var(
1230
- --_ctm-mob-dn-al-pe-bd-cr,
1231
- var(--_ctm-tab-dn-al-pe-bd-cr, var(--_ctm-dn-al-pe-bd-cr))
1232
- );
1233
- color: var(--_ctm-mob-dn-al-pe-cr, var(--_ctm-tab-dn-al-pe-cr, var(--_ctm-dn-al-pe-cr)));
1234
- font-family: var(
1235
- --_ctm-mob-dn-al-pe-ft-fy,
1236
- var(--_ctm-tab-dn-al-pe-ft-fy, var(--_ctm-dn-al-pe-ft-fy))
1237
- );
1238
- font-size: var(
1239
- --_ctm-mob-dn-al-pe-ft-se,
1240
- var(--_ctm-tab-dn-al-pe-ft-se, var(--_ctm-dn-al-pe-ft-se))
1241
- );
1242
- font-weight: var(
1243
- --_ctm-mob-dn-al-pe-ft-wt,
1244
- var(--_ctm-tab-dn-al-pe-ft-wt, var(--_ctm-dn-al-pe-ft-wt))
1245
- );
1246
- font-style: var(
1247
- --_ctm-mob-dn-al-pe-ft-se-ic,
1248
- var(--_ctm-tab-dn-al-pe-ft-se-ic, var(--_ctm-dn-al-pe-ft-se-ic))
1249
- );
1250
- text-align: var(
1251
- --_ctm-mob-dn-al-pe-tt-an,
1252
- var(--_ctm-tab-dn-al-pe-tt-an, var(--_ctm-dn-al-pe-tt-an))
1253
- );
1254
- letter-spacing: var(
1255
- --_ctm-mob-dn-al-pe-lr-sg,
1256
- var(--_ctm-tab-dn-al-pe-lr-sg, var(--_ctm-dn-al-pe-lr-sg))
1257
- );
1258
- line-height: var(
1259
- --_ctm-mob-dn-al-pe-le-ht,
1260
- var(--_ctm-tab-dn-al-pe-le-ht, var(--_ctm-dn-al-pe-le-ht))
1261
- );
1262
- text-decoration: var(
1263
- --_ctm-mob-dn-al-pe-ue,
1264
- var(--_ctm-tab-dn-al-pe-ue, var(--_ctm-dn-al-pe-ue))
1265
- );
1266
-
1267
- border-color: var(
1268
- --_show-border,
1269
- var(
1270
- --_ctm-mob-dn-al-pe-br-cr,
1271
- var(--_ctm-tab-dn-al-pe-br-cr, var(--_ctm-dn-al-pe-br-cr))
1272
- )
1273
- );
1274
- border-style: var(
1275
- --_show-border,
1276
- var(
1277
- --_ctm-mob-dn-al-pe-br-se,
1278
- var(--_ctm-tab-dn-al-pe-br-se, var(--_ctm-dn-al-pe-br-se))
1279
- )
1280
- );
1281
- border-width: var(
1282
- --_show-border,
1283
- var(
1284
- --_ctm-mob-dn-al-pe-br-wh,
1285
- var(--_ctm-tab-dn-al-pe-br-wh, var(--_ctm-dn-al-pe-br-wh))
1286
- )
1287
- );
1288
- border-radius: var(
1289
- --_ctm-mob-dn-al-pe-br-rs,
1290
- var(--_ctm-tab-dn-al-pe-br-rs, var(--_ctm-dn-al-pe-br-rs))
1291
- );
1292
-
1293
- box-shadow: var(
1294
- --_show-shadow,
1295
- var(
1296
- --_ctm-mob-dn-al-pe-sw-ae,
1297
- var(--_ctm-tab-dn-al-pe-sw-ae, var(--_ctm-dn-al-pe-sw-ae))
1298
- )
1299
- var(
1300
- --_ctm-mob-dn-al-pe-sw-br,
1301
- var(--_ctm-tab-dn-al-pe-sw-br, var(--_ctm-dn-al-pe-sw-br))
1302
- )
1303
- var(
1304
- --_ctm-mob-dn-al-pe-sw-sd,
1305
- var(--_ctm-tab-dn-al-pe-sw-sd, var(--_ctm-dn-al-pe-sw-sd))
1306
- )
1307
- var(
1308
- --_ctm-mob-dn-al-pe-sw-cr,
1309
- var(--_ctm-tab-dn-al-pe-sw-cr, var(--_ctm-dn-al-pe-sw-cr))
1310
- )
1311
- );
1312
- }
1313
-
1314
- .code-span {
1315
- background-color: var(
1316
- --_ctm-mob-dn-cy-ce-se-bd-cr,
1317
- var(--_ctm-tab-dn-cy-ce-se-bd-cr, var(--_ctm-dn-cy-ce-se-bd-cr))
1318
- );
1319
- color: var(
1320
- --_ctm-mob-dn-cy-ce-se-cr,
1321
- var(--_ctm-tab-dn-cy-ce-se-cr, var(--_ctm-dn-cy-ce-se-cr))
1322
- );
1323
- font-family: var(
1324
- --_ctm-mob-dn-cy-ce-se-ft-fy,
1325
- var(--_ctm-tab-dn-cy-ce-se-ft-fy, var(--_ctm-dn-cy-ce-se-ft-fy))
1326
- );
1327
- font-size: var(
1328
- --_ctm-mob-dn-cy-ce-se-ft-se,
1329
- var(--_ctm-tab-dn-cy-ce-se-ft-se, var(--_ctm-dn-cy-ce-se-ft-se))
1330
- );
1331
- font-weight: var(
1332
- --_ctm-mob-dn-cy-ce-se-ft-wt,
1333
- var(--_ctm-tab-dn-cy-ce-se-ft-wt, var(--_ctm-dn-cy-ce-se-ft-wt))
1334
- );
1335
- font-style: var(
1336
- --_ctm-mob-dn-cy-ce-se-ft-se-ic,
1337
- var(--_ctm-tab-dn-cy-ce-se-ft-se-ic, var(--_ctm-dn-cy-ce-se-ft-se-ic))
1338
- );
1339
- text-align: var(
1340
- --_ctm-mob-dn-cy-ce-se-tt-an,
1341
- var(--_ctm-tab-dn-cy-ce-se-tt-an, var(--_ctm-dn-cy-ce-se-tt-an))
1342
- );
1343
- letter-spacing: var(
1344
- --_ctm-mob-dn-cy-ce-se-lr-sg,
1345
- var(--_ctm-tab-dn-cy-ce-se-lr-sg, var(--_ctm-dn-cy-ce-se-lr-sg))
1346
- );
1347
- line-height: var(
1348
- --_ctm-mob-dn-cy-ce-se-le-ht,
1349
- var(--_ctm-tab-dn-cy-ce-se-le-ht, var(--_ctm-dn-cy-ce-se-le-ht))
1350
- );
1351
- text-decoration: var(
1352
- --_ctm-mob-dn-cy-ce-se-ue,
1353
- var(--_ctm-tab-dn-cy-ce-se-ue, var(--_ctm-dn-cy-ce-se-ue))
1354
- );
1355
-
1356
- border-color: var(
1357
- --_show-border,
1358
- var(
1359
- --_ctm-mob-dn-cy-ce-se-br-cr,
1360
- var(--_ctm-tab-dn-cy-ce-se-br-cr, var(--_ctm-dn-cy-ce-se-br-cr))
1361
- )
1362
- );
1363
- border-style: var(
1364
- --_show-border,
1365
- var(
1366
- --_ctm-mob-dn-cy-ce-se-br-se,
1367
- var(--_ctm-tab-dn-cy-ce-se-br-se, var(--_ctm-dn-cy-ce-se-br-se))
1368
- )
1369
- );
1370
- border-width: var(
1371
- --_show-border,
1372
- var(
1373
- --_ctm-mob-dn-cy-ce-se-br-wh,
1374
- var(--_ctm-tab-dn-cy-ce-se-br-wh, var(--_ctm-dn-cy-ce-se-br-wh))
1375
- )
1376
- );
1377
- border-radius: var(
1378
- --_ctm-mob-dn-cy-ce-se-br-rs,
1379
- var(--_ctm-tab-dn-cy-ce-se-br-rs, var(--_ctm-dn-cy-ce-se-br-rs))
1380
- );
1381
-
1382
- box-shadow: var(
1383
- --_show-shadow,
1384
- var(
1385
- --_ctm-mob-dn-cy-ce-se-sw-ae,
1386
- var(--_ctm-tab-dn-cy-ce-se-sw-ae, var(--_ctm-dn-cy-ce-se-sw-ae))
1387
- )
1388
- var(
1389
- --_ctm-mob-dn-cy-ce-se-sw-br,
1390
- var(--_ctm-tab-dn-cy-ce-se-sw-br, var(--_ctm-dn-cy-ce-se-sw-br))
1391
- )
1392
- var(
1393
- --_ctm-mob-dn-cy-ce-se-sw-sd,
1394
- var(--_ctm-tab-dn-cy-ce-se-sw-sd, var(--_ctm-dn-cy-ce-se-sw-sd))
1395
- )
1396
- var(
1397
- --_ctm-mob-dn-cy-ce-se-sw-cr,
1398
- var(--_ctm-tab-dn-cy-ce-se-sw-cr, var(--_ctm-dn-cy-ce-se-sw-cr))
1399
- )
1400
- );
1401
- }
1402
-
1403
- .uom-span {
1404
- background-color: var(
1405
- --_ctm-mob-dn-um-se-bd-cr,
1406
- var(--_ctm-tab-dn-um-se-bd-cr, var(--_ctm-dn-um-se-bd-cr))
1407
- );
1408
- color: var(--_ctm-mob-dn-um-se-cr, var(--_ctm-tab-dn-um-se-cr, var(--_ctm-dn-um-se-cr)));
1409
- font-family: var(
1410
- --_ctm-mob-dn-um-se-ft-fy,
1411
- var(--_ctm-tab-dn-um-se-ft-fy, var(--_ctm-dn-um-se-ft-fy))
1412
- );
1413
- font-size: var(
1414
- --_ctm-mob-dn-um-se-ft-se,
1415
- var(--_ctm-tab-dn-um-se-ft-se, var(--_ctm-dn-um-se-ft-se))
1416
- );
1417
- font-weight: var(
1418
- --_ctm-mob-dn-um-se-ft-wt,
1419
- var(--_ctm-tab-dn-um-se-ft-wt, var(--_ctm-dn-um-se-ft-wt))
1420
- );
1421
- font-style: var(
1422
- --_ctm-mob-dn-um-se-ft-se-ic,
1423
- var(--_ctm-tab-dn-um-se-ft-se-ic, var(--_ctm-dn-um-se-ft-se-ic))
1424
- );
1425
- text-align: var(
1426
- --_ctm-mob-dn-um-se-tt-an,
1427
- var(--_ctm-tab-dn-um-se-tt-an, var(--_ctm-dn-um-se-tt-an))
1428
- );
1429
- letter-spacing: var(
1430
- --_ctm-mob-dn-um-se-lr-sg,
1431
- var(--_ctm-tab-dn-um-se-lr-sg, var(--_ctm-dn-um-se-lr-sg))
1432
- );
1433
- line-height: var(
1434
- --_ctm-mob-dn-um-se-le-ht,
1435
- var(--_ctm-tab-dn-um-se-le-ht, var(--_ctm-dn-um-se-le-ht))
1436
- );
1437
- text-decoration: var(
1438
- --_ctm-mob-dn-um-se-ue,
1439
- var(--_ctm-tab-dn-um-se-ue, var(--_ctm-dn-um-se-ue))
1440
- );
1441
-
1442
- border-color: var(
1443
- --_show-border,
1444
- var(
1445
- --_ctm-mob-dn-um-se-br-cr,
1446
- var(--_ctm-tab-dn-um-se-br-cr, var(--_ctm-dn-um-se-br-cr))
1447
- )
1448
- );
1449
- border-style: var(
1450
- --_show-border,
1451
- var(
1452
- --_ctm-mob-dn-um-se-br-se,
1453
- var(--_ctm-tab-dn-um-se-br-se, var(--_ctm-dn-um-se-br-se))
1454
- )
1455
- );
1456
- border-width: var(
1457
- --_show-border,
1458
- var(
1459
- --_ctm-mob-dn-um-se-br-wh,
1460
- var(--_ctm-tab-dn-um-se-br-wh, var(--_ctm-dn-um-se-br-wh))
1461
- )
1462
- );
1463
- border-radius: var(
1464
- --_ctm-mob-dn-um-se-br-rs,
1465
- var(--_ctm-tab-dn-um-se-br-rs, var(--_ctm-dn-um-se-br-rs))
1466
- );
1467
-
1468
- box-shadow: var(
1469
- --_show-shadow,
1470
- var(
1471
- --_ctm-mob-dn-um-se-sw-ae,
1472
- var(--_ctm-tab-dn-um-se-sw-ae, var(--_ctm-dn-um-se-sw-ae))
1473
- )
1474
- var(
1475
- --_ctm-mob-dn-um-se-sw-br,
1476
- var(--_ctm-tab-dn-um-se-sw-br, var(--_ctm-dn-um-se-sw-br))
1477
- )
1478
- var(
1479
- --_ctm-mob-dn-um-se-sw-sd,
1480
- var(--_ctm-tab-dn-um-se-sw-sd, var(--_ctm-dn-um-se-sw-sd))
1481
- )
1482
- var(
1483
- --_ctm-mob-dn-um-se-sw-cr,
1484
- var(--_ctm-tab-dn-um-se-sw-cr, var(--_ctm-dn-um-se-sw-cr))
1485
- )
1486
- );
1487
- }
1488
- }
1489
- }
1490
- .product-savings {
1491
- .product-savings-wrapper {
1492
- .savings-percent-span {
1493
- background-color: var(
1494
- --_ctm-mob-dn-ss-bd-cr,
1495
- var(--_ctm-tab-dn-ss-bd-cr, var(--_ctm-dn-ss-bd-cr))
1496
- );
1497
- color: var(--_ctm-mob-dn-ss-cr, var(--_ctm-tab-dn-ss-cr, var(--_ctm-dn-ss-cr)));
1498
- font-family: var(
1499
- --_ctm-mob-dn-ss-ft-fy,
1500
- var(--_ctm-tab-dn-ss-ft-fy, var(--_ctm-dn-ss-ft-fy))
1501
- );
1502
- font-size: var(
1503
- --_ctm-mob-dn-ss-ft-se,
1504
- var(--_ctm-tab-dn-ss-ft-se, var(--_ctm-dn-ss-ft-se))
1505
- );
1506
- font-weight: var(
1507
- --_ctm-mob-dn-ss-ft-wt,
1508
- var(--_ctm-tab-dn-ss-ft-wt, var(--_ctm-dn-ss-ft-wt))
1509
- );
1510
- font-style: var(
1511
- --_ctm-mob-dn-ss-ft-se-ic,
1512
- var(--_ctm-tab-dn-ss-ft-se-ic, var(--_ctm-dn-ss-ft-se-ic))
1513
- );
1514
- text-align: var(
1515
- --_ctm-mob-dn-ss-tt-an,
1516
- var(--_ctm-tab-dn-ss-tt-an, var(--_ctm-dn-ss-tt-an))
1517
- );
1518
- letter-spacing: var(
1519
- --_ctm-mob-dn-ss-lr-sg,
1520
- var(--_ctm-tab-dn-ss-lr-sg, var(--_ctm-dn-ss-lr-sg))
1521
- );
1522
- line-height: var(
1523
- --_ctm-mob-dn-ss-le-ht,
1524
- var(--_ctm-tab-dn-ss-le-ht, var(--_ctm-dn-ss-le-ht))
1525
- );
1526
- text-decoration: var(--_ctm-mob-dn-ss-ue, var(--_ctm-tab-dn-ss-ue, var(--_ctm-dn-ss-ue)));
1527
-
1528
- border-color: var(
1529
- --_show-border,
1530
- var(--_ctm-mob-dn-ss-br-cr, var(--_ctm-tab-dn-ss-br-cr, var(--_ctm-dn-ss-br-cr)))
1531
- );
1532
- border-style: var(
1533
- --_show-border,
1534
- var(--_ctm-mob-dn-ss-br-se, var(--_ctm-tab-dn-ss-br-se, var(--_ctm-dn-ss-br-se)))
1535
- );
1536
- border-width: var(
1537
- --_show-border,
1538
- var(--_ctm-mob-dn-ss-br-wh, var(--_ctm-tab-dn-ss-br-wh, var(--_ctm-dn-ss-br-wh)))
1539
- );
1540
- border-radius: var(
1541
- --_ctm-mob-dn-ss-br-rs,
1542
- var(--_ctm-tab-dn-ss-br-rs, var(--_ctm-dn-ss-br-rs))
1543
- );
1544
-
1545
- box-shadow: var(
1546
- --_show-shadow,
1547
- var(--_ctm-mob-dn-ss-sw-ae, var(--_ctm-tab-dn-ss-sw-ae, var(--_ctm-dn-ss-sw-ae)))
1548
- var(--_ctm-mob-dn-ss-sw-br, var(--_ctm-tab-dn-ss-sw-br, var(--_ctm-dn-ss-sw-br)))
1549
- var(--_ctm-mob-dn-ss-sw-sd, var(--_ctm-tab-dn-ss-sw-sd, var(--_ctm-dn-ss-sw-sd)))
1550
- var(--_ctm-mob-dn-ss-sw-cr, var(--_ctm-tab-dn-ss-sw-cr, var(--_ctm-dn-ss-sw-cr)))
1551
- );
1552
- }
1553
- .savings-value-span {
1554
- background-color: var(
1555
- --_ctm-mob-dn-ss-ve-bd-cr,
1556
- var(--_ctm-tab-dn-ss-ve-bd-cr, var(--_ctm-dn-ss-ve-bd-cr))
1557
- );
1558
- color: var(--_ctm-mob-dn-ss-ve-cr, var(--_ctm-tab-dn-ss-ve-cr, var(--_ctm-dn-ss-ve-cr)));
1559
- font-family: var(
1560
- --_ctm-mob-dn-ss-ve-ft-fy,
1561
- var(--_ctm-tab-dn-ss-ve-ft-fy, var(--_ctm-dn-ss-ve-ft-fy))
1562
- );
1563
- font-size: var(
1564
- --_ctm-mob-dn-ss-ve-ft-se,
1565
- var(--_ctm-tab-dn-ss-ve-ft-se, var(--_ctm-dn-ss-ve-ft-se))
1566
- );
1567
- font-weight: var(
1568
- --_ctm-mob-dn-ss-ve-ft-wt,
1569
- var(--_ctm-tab-dn-ss-ve-ft-wt, var(--_ctm-dn-ss-ve-ft-wt))
1570
- );
1571
- font-style: var(
1572
- --_ctm-mob-dn-ss-ve-ft-se-ic,
1573
- var(--_ctm-tab-dn-ss-ve-ft-se-ic, var(--_ctm-dn-ss-ve-ft-se-ic))
1574
- );
1575
- text-align: var(
1576
- --_ctm-mob-dn-ss-ve-tt-an,
1577
- var(--_ctm-tab-dn-ss-ve-tt-an, var(--_ctm-dn-ss-ve-tt-an))
1578
- );
1579
- letter-spacing: var(
1580
- --_ctm-mob-dn-ss-ve-lr-sg,
1581
- var(--_ctm-tab-dn-ss-ve-lr-sg, var(--_ctm-dn-ss-ve-lr-sg))
1582
- );
1583
- line-height: var(
1584
- --_ctm-mob-dn-ss-ve-le-ht,
1585
- var(--_ctm-tab-dn-ss-ve-le-ht, var(--_ctm-dn-ss-ve-le-ht))
1586
- );
1587
- text-decoration: var(
1588
- --_ctm-mob-dn-ss-ve-ue,
1589
- var(--_ctm-tab-dn-ss-ve-ue, var(--_ctm-dn-ss-ve-ue))
1590
- );
1591
-
1592
- border-color: var(
1593
- --_show-border,
1594
- var(
1595
- --_ctm-mob-dn-ss-ve-br-cr,
1596
- var(--_ctm-tab-dn-ss-ve-br-cr, var(--_ctm-dn-ss-ve-br-cr))
1597
- )
1598
- );
1599
- border-style: var(
1600
- --_show-border,
1601
- var(
1602
- --_ctm-mob-dn-ss-ve-br-se,
1603
- var(--_ctm-tab-dn-ss-ve-br-se, var(--_ctm-dn-ss-ve-br-se))
1604
- )
1605
- );
1606
- border-width: var(
1607
- --_show-border,
1608
- var(
1609
- --_ctm-mob-dn-ss-ve-br-wh,
1610
- var(--_ctm-tab-dn-ss-ve-br-wh, var(--_ctm-dn-ss-ve-br-wh))
1611
- )
1612
- );
1613
- border-radius: var(
1614
- --_ctm-mob-dn-ss-ve-br-rs,
1615
- var(--_ctm-tab-dn-ss-ve-br-rs, var(--_ctm-dn-ss-ve-br-rs))
1616
- );
1617
-
1618
- box-shadow: var(
1619
- --_show-shadow,
1620
- var(
1621
- --_ctm-mob-dn-ss-ve-sw-ae,
1622
- var(--_ctm-tab-dn-ss-ve-sw-ae, var(--_ctm-dn-ss-ve-sw-ae))
1623
- )
1624
- var(
1625
- --_ctm-mob-dn-ss-ve-sw-br,
1626
- var(--_ctm-tab-dn-ss-ve-sw-br, var(--_ctm-dn-ss-ve-sw-br))
1627
- )
1628
- var(
1629
- --_ctm-mob-dn-ss-ve-sw-sd,
1630
- var(--_ctm-tab-dn-ss-ve-sw-sd, var(--_ctm-dn-ss-ve-sw-sd))
1631
- )
1632
- var(
1633
- --_ctm-mob-dn-ss-ve-sw-cr,
1634
- var(--_ctm-tab-dn-ss-ve-sw-cr, var(--_ctm-dn-ss-ve-sw-cr))
1635
- )
1636
- );
1637
- }
1638
- .code-span {
1639
- background-color: var(
1640
- --_ctm-mob-dn-cy-ce-se-bd-cr,
1641
- var(--_ctm-tab-dn-cy-ce-se-bd-cr, var(--_ctm-dn-cy-ce-se-bd-cr))
1642
- );
1643
- color: var(
1644
- --_ctm-mob-dn-cy-ce-se-cr,
1645
- var(--_ctm-tab-dn-cy-ce-se-cr, var(--_ctm-dn-cy-ce-se-cr))
1646
- );
1647
- font-family: var(
1648
- --_ctm-mob-dn-cy-ce-se-ft-fy,
1649
- var(--_ctm-tab-dn-cy-ce-se-ft-fy, var(--_ctm-dn-cy-ce-se-ft-fy))
1650
- );
1651
- font-size: var(
1652
- --_ctm-mob-dn-cy-ce-se-ft-se,
1653
- var(--_ctm-tab-dn-cy-ce-se-ft-se, var(--_ctm-dn-cy-ce-se-ft-se))
1654
- );
1655
- font-weight: var(
1656
- --_ctm-mob-dn-cy-ce-se-ft-wt,
1657
- var(--_ctm-tab-dn-cy-ce-se-ft-wt, var(--_ctm-dn-cy-ce-se-ft-wt))
1658
- );
1659
- font-style: var(
1660
- --_ctm-mob-dn-cy-ce-se-ft-se-ic,
1661
- var(--_ctm-tab-dn-cy-ce-se-ft-se-ic, var(--_ctm-dn-cy-ce-se-ft-se-ic))
1662
- );
1663
- text-align: var(
1664
- --_ctm-mob-dn-cy-ce-se-tt-an,
1665
- var(--_ctm-tab-dn-cy-ce-se-tt-an, var(--_ctm-dn-cy-ce-se-tt-an))
1666
- );
1667
- letter-spacing: var(
1668
- --_ctm-mob-dn-cy-ce-se-lr-sg,
1669
- var(--_ctm-tab-dn-cy-ce-se-lr-sg, var(--_ctm-dn-cy-ce-se-lr-sg))
1670
- );
1671
- line-height: var(
1672
- --_ctm-mob-dn-cy-ce-se-le-ht,
1673
- var(--_ctm-tab-dn-cy-ce-se-le-ht, var(--_ctm-dn-cy-ce-se-le-ht))
1674
- );
1675
- text-decoration: var(
1676
- --_ctm-mob-dn-cy-ce-se-ue,
1677
- var(--_ctm-tab-dn-cy-ce-se-ue, var(--_ctm-dn-cy-ce-se-ue))
1678
- );
1679
-
1680
- border-color: var(
1681
- --_show-border,
1682
- var(
1683
- --_ctm-mob-dn-cy-ce-se-br-cr,
1684
- var(--_ctm-tab-dn-cy-ce-se-br-cr, var(--_ctm-dn-cy-ce-se-br-cr))
1685
- )
1686
- );
1687
- border-style: var(
1688
- --_show-border,
1689
- var(
1690
- --_ctm-mob-dn-cy-ce-se-br-se,
1691
- var(--_ctm-tab-dn-cy-ce-se-br-se, var(--_ctm-dn-cy-ce-se-br-se))
1692
- )
1693
- );
1694
- border-width: var(
1695
- --_show-border,
1696
- var(
1697
- --_ctm-mob-dn-cy-ce-se-br-wh,
1698
- var(--_ctm-tab-dn-cy-ce-se-br-wh, var(--_ctm-dn-cy-ce-se-br-wh))
1699
- )
1700
- );
1701
- border-radius: var(
1702
- --_ctm-mob-dn-cy-ce-se-br-rs,
1703
- var(--_ctm-tab-dn-cy-ce-se-br-rs, var(--_ctm-dn-cy-ce-se-br-rs))
1704
- );
1705
-
1706
- box-shadow: var(
1707
- --_show-shadow,
1708
- var(
1709
- --_ctm-mob-dn-cy-ce-se-sw-ae,
1710
- var(--_ctm-tab-dn-cy-ce-se-sw-ae, var(--_ctm-dn-cy-ce-se-sw-ae))
1711
- )
1712
- var(
1713
- --_ctm-mob-dn-cy-ce-se-sw-br,
1714
- var(--_ctm-tab-dn-cy-ce-se-sw-br, var(--_ctm-dn-cy-ce-se-sw-br))
1715
- )
1716
- var(
1717
- --_ctm-mob-dn-cy-ce-se-sw-sd,
1718
- var(--_ctm-tab-dn-cy-ce-se-sw-sd, var(--_ctm-dn-cy-ce-se-sw-sd))
1719
- )
1720
- var(
1721
- --_ctm-mob-dn-cy-ce-se-sw-cr,
1722
- var(--_ctm-tab-dn-cy-ce-se-sw-cr, var(--_ctm-dn-cy-ce-se-sw-cr))
1723
- )
1724
- );
1725
- }
1726
- }
1727
- }
1728
- .total-price-container {
1729
- .tax-box {
1730
- display: flex;
1731
- align-items: center;
1732
- justify-content: space-between;
1733
- gap: 5px;
1734
-
1735
- background-color: var(
1736
- --_ctm-mob-dn-pt-tx-bd-cr,
1737
- var(--_ctm-tab-dn-pt-tx-bd-cr, var(--_ctm-dn-pt-tx-bd-cr))
1738
- );
1739
- color: var(--_ctm-mob-dn-pt-tx-cr, var(--_ctm-tab-dn-pt-tx-cr, var(--_ctm-dn-pt-tx-cr)));
1740
- font-family: var(
1741
- --_ctm-mob-dn-pt-tx-ft-fy,
1742
- var(--_ctm-tab-dn-pt-tx-ft-fy, var(--_ctm-dn-pt-tx-ft-fy))
1743
- );
1744
- font-size: var(
1745
- --_ctm-mob-dn-pt-tx-ft-se,
1746
- var(--_ctm-tab-dn-pt-tx-ft-se, var(--_ctm-dn-pt-tx-ft-se))
1747
- );
1748
- font-weight: var(
1749
- --_ctm-mob-dn-pt-tx-ft-wt,
1750
- var(--_ctm-tab-dn-pt-tx-ft-wt, var(--_ctm-dn-pt-tx-ft-wt))
1751
- );
1752
- font-style: var(
1753
- --_ctm-mob-dn-pt-tx-ft-se-ic,
1754
- var(--_ctm-tab-dn-pt-tx-ft-se-ic, var(--_ctm-dn-pt-tx-ft-se-ic))
1755
- );
1756
- text-align: var(
1757
- --_ctm-mob-dn-pt-tx-tt-an,
1758
- var(--_ctm-tab-dn-pt-tx-tt-an, var(--_ctm-dn-pt-tx-tt-an))
1759
- );
1760
- letter-spacing: var(
1761
- --_ctm-mob-dn-pt-tx-lr-sg,
1762
- var(--_ctm-tab-dn-pt-tx-lr-sg, var(--_ctm-dn-pt-tx-lr-sg))
1763
- );
1764
- line-height: var(
1765
- --_ctm-mob-dn-pt-tx-le-ht,
1766
- var(--_ctm-tab-dn-pt-tx-le-ht, var(--_ctm-dn-pt-tx-le-ht))
1767
- );
1768
- text-decoration: var(
1769
- --_ctm-mob-dn-pt-tx-ue,
1770
- var(--_ctm-tab-dn-pt-tx-ue, var(--_ctm-dn-pt-tx-ue))
1771
- );
1772
-
1773
- border-color: var(
1774
- --_show-border,
1775
- var(--_ctm-mob-dn-pt-tx-br-cr, var(--_ctm-tab-dn-pt-tx-br-cr, var(--_ctm-dn-pt-tx-br-cr)))
1776
- );
1777
- border-style: var(
1778
- --_show-border,
1779
- var(--_ctm-mob-dn-pt-tx-br-se, var(--_ctm-tab-dn-pt-tx-br-se, var(--_ctm-dn-pt-tx-br-se)))
1780
- );
1781
- border-width: var(
1782
- --_show-border,
1783
- var(--_ctm-mob-dn-pt-tx-br-wh, var(--_ctm-tab-dn-pt-tx-br-wh, var(--_ctm-dn-pt-tx-br-wh)))
1784
- );
1785
- border-radius: var(
1786
- --_ctm-mob-dn-pt-tx-br-rs,
1787
- var(--_ctm-tab-dn-pt-tx-br-rs, var(--_ctm-dn-pt-tx-br-rs))
1788
- );
1789
-
1790
- box-shadow: var(
1791
- --_show-shadow,
1792
- var(--_ctm-mob-dn-pt-tx-sw-ae, var(--_ctm-tab-dn-pt-tx-sw-ae, var(--_ctm-dn-pt-tx-sw-ae)))
1793
- var(
1794
- --_ctm-mob-dn-pt-tx-sw-br,
1795
- var(--_ctm-tab-dn-pt-tx-sw-br, var(--_ctm-dn-pt-tx-sw-br))
1796
- )
1797
- var(
1798
- --_ctm-mob-dn-pt-tx-sw-sd,
1799
- var(--_ctm-tab-dn-pt-tx-sw-sd, var(--_ctm-dn-pt-tx-sw-sd))
1800
- )
1801
- var(
1802
- --_ctm-mob-dn-pt-tx-sw-cr,
1803
- var(--_ctm-tab-dn-pt-tx-sw-cr, var(--_ctm-dn-pt-tx-sw-cr))
1804
- )
1805
- );
1806
- }
1807
- .shipping-box {
1808
- display: flex;
1809
- align-items: center;
1810
- justify-content: space-between;
1811
- gap: 5px;
1812
-
1813
- background-color: var(
1814
- --_ctm-mob-dn-pt-sg-pe-bd-cr,
1815
- var(--_ctm-tab-dn-pt-sg-pe-bd-cr, var(--_ctm-dn-pt-sg-pe-bd-cr))
1816
- );
1817
- color: var(
1818
- --_ctm-mob-dn-pt-sg-pe-cr,
1819
- var(--_ctm-tab-dn-pt-sg-pe-cr, var(--_ctm-dn-pt-sg-pe-cr))
1820
- );
1821
- font-family: var(
1822
- --_ctm-mob-dn-pt-sg-pe-ft-fy,
1823
- var(--_ctm-tab-dn-pt-sg-pe-ft-fy, var(--_ctm-dn-pt-sg-pe-ft-fy))
1824
- );
1825
- font-size: var(
1826
- --_ctm-mob-dn-pt-sg-pe-ft-se,
1827
- var(--_ctm-tab-dn-pt-sg-pe-ft-se, var(--_ctm-dn-pt-sg-pe-ft-se))
1828
- );
1829
- font-weight: var(
1830
- --_ctm-mob-dn-pt-sg-pe-ft-wt,
1831
- var(--_ctm-tab-dn-pt-sg-pe-ft-wt, var(--_ctm-dn-pt-sg-pe-ft-wt))
1832
- );
1833
- font-style: var(
1834
- --_ctm-mob-dn-pt-sg-pe-ft-se-ic,
1835
- var(--_ctm-tab-dn-pt-sg-pe-ft-se-ic, var(--_ctm-dn-pt-sg-pe-ft-se-ic))
1836
- );
1837
- text-align: var(
1838
- --_ctm-mob-dn-pt-sg-pe-tt-an,
1839
- var(--_ctm-tab-dn-pt-sg-pe-tt-an, var(--_ctm-dn-pt-sg-pe-tt-an))
1840
- );
1841
- letter-spacing: var(
1842
- --_ctm-mob-dn-pt-sg-pe-lr-sg,
1843
- var(--_ctm-tab-dn-pt-sg-pe-lr-sg, var(--_ctm-dn-pt-sg-pe-lr-sg))
1844
- );
1845
- line-height: var(
1846
- --_ctm-mob-dn-pt-sg-pe-le-ht,
1847
- var(--_ctm-tab-dn-pt-sg-pe-le-ht, var(--_ctm-dn-pt-sg-pe-le-ht))
1848
- );
1849
- text-decoration: var(
1850
- --_ctm-mob-dn-pt-sg-pe-ue,
1851
- var(--_ctm-tab-dn-pt-sg-pe-ue, var(--_ctm-dn-pt-sg-pe-ue))
1852
- );
1853
-
1854
- border-color: var(
1855
- --_show-border,
1856
- var(
1857
- --_ctm-mob-dn-pt-sg-pe-br-cr,
1858
- var(--_ctm-tab-dn-pt-sg-pe-br-cr, var(--_ctm-dn-pt-sg-pe-br-cr))
1859
- )
1860
- );
1861
- border-style: var(
1862
- --_show-border,
1863
- var(
1864
- --_ctm-mob-dn-pt-sg-pe-br-se,
1865
- var(--_ctm-tab-dn-pt-sg-pe-br-se, var(--_ctm-dn-pt-sg-pe-br-se))
1866
- )
1867
- );
1868
- border-width: var(
1869
- --_show-border,
1870
- var(
1871
- --_ctm-mob-dn-pt-sg-pe-br-wh,
1872
- var(--_ctm-tab-dn-pt-sg-pe-br-wh, var(--_ctm-dn-pt-sg-pe-br-wh))
1873
- )
1874
- );
1875
- border-radius: var(
1876
- --_ctm-mob-dn-pt-sg-pe-br-rs,
1877
- var(--_ctm-tab-dn-pt-sg-pe-br-rs, var(--_ctm-dn-pt-sg-pe-br-rs))
1878
- );
1879
-
1880
- box-shadow: var(
1881
- --_show-shadow,
1882
- var(
1883
- --_ctm-mob-dn-pt-sg-pe-sw-ae,
1884
- var(--_ctm-tab-dn-pt-sg-pe-sw-ae, var(--_ctm-dn-pt-sg-pe-sw-ae))
1885
- )
1886
- var(
1887
- --_ctm-mob-dn-pt-sg-pe-sw-br,
1888
- var(--_ctm-tab-dn-pt-sg-pe-sw-br, var(--_ctm-dn-pt-sg-pe-sw-br))
1889
- )
1890
- var(
1891
- --_ctm-mob-dn-pt-sg-pe-sw-sd,
1892
- var(--_ctm-tab-dn-pt-sg-pe-sw-sd, var(--_ctm-dn-pt-sg-pe-sw-sd))
1893
- )
1894
- var(
1895
- --_ctm-mob-dn-pt-sg-pe-sw-cr,
1896
- var(--_ctm-tab-dn-pt-sg-pe-sw-cr, var(--_ctm-dn-pt-sg-pe-sw-cr))
1897
- )
1898
- );
1899
- }
1900
- .embellishment-box {
1901
- display: flex;
1902
- align-items: center;
1903
- justify-content: space-between;
1904
- gap: 5px;
1905
-
1906
- background-color: var(
1907
- --_ctm-mob-dn-et-pe-bd-cr,
1908
- var(--_ctm-tab-dn-et-pe-bd-cr, var(--_ctm-dn-et-pe-bd-cr))
1909
- );
1910
- color: var(--_ctm-mob-dn-et-pe-cr, var(--_ctm-tab-dn-et-pe-cr, var(--_ctm-dn-et-pe-cr)));
1911
- font-family: var(
1912
- --_ctm-mob-dn-et-pe-ft-fy,
1913
- var(--_ctm-tab-dn-et-pe-ft-fy, var(--_ctm-dn-et-pe-ft-fy))
1914
- );
1915
- font-size: var(
1916
- --_ctm-mob-dn-et-pe-ft-se,
1917
- var(--_ctm-tab-dn-et-pe-ft-se, var(--_ctm-dn-et-pe-ft-se))
1918
- );
1919
- font-weight: var(
1920
- --_ctm-mob-dn-et-pe-ft-wt,
1921
- var(--_ctm-tab-dn-et-pe-ft-wt, var(--_ctm-dn-et-pe-ft-wt))
1922
- );
1923
- font-style: var(
1924
- --_ctm-mob-dn-et-pe-ft-se-ic,
1925
- var(--_ctm-tab-dn-et-pe-ft-se-ic, var(--_ctm-dn-et-pe-ft-se-ic))
1926
- );
1927
- text-align: var(
1928
- --_ctm-mob-dn-et-pe-tt-an,
1929
- var(--_ctm-tab-dn-et-pe-tt-an, var(--_ctm-dn-et-pe-tt-an))
1930
- );
1931
- letter-spacing: var(
1932
- --_ctm-mob-dn-et-pe-lr-sg,
1933
- var(--_ctm-tab-dn-et-pe-lr-sg, var(--_ctm-dn-et-pe-lr-sg))
1934
- );
1935
- line-height: var(
1936
- --_ctm-mob-dn-et-pe-le-ht,
1937
- var(--_ctm-tab-dn-et-pe-le-ht, var(--_ctm-dn-et-pe-le-ht))
1938
- );
1939
- text-decoration: var(
1940
- --_ctm-mob-dn-et-pe-ue,
1941
- var(--_ctm-tab-dn-et-pe-ue, var(--_ctm-dn-et-pe-ue))
1942
- );
1943
-
1944
- border-color: var(
1945
- --_show-border,
1946
- var(--_ctm-mob-dn-et-pe-br-cr, var(--_ctm-tab-dn-et-pe-br-cr, var(--_ctm-dn-et-pe-br-cr)))
1947
- );
1948
- border-style: var(
1949
- --_show-border,
1950
- var(--_ctm-mob-dn-et-pe-br-se, var(--_ctm-tab-dn-et-pe-br-se, var(--_ctm-dn-et-pe-br-se)))
1951
- );
1952
- border-width: var(
1953
- --_show-border,
1954
- var(--_ctm-mob-dn-et-pe-br-wh, var(--_ctm-tab-dn-et-pe-br-wh, var(--_ctm-dn-et-pe-br-wh)))
1955
- );
1956
- border-radius: var(
1957
- --_ctm-mob-dn-et-pe-br-rs,
1958
- var(--_ctm-tab-dn-et-pe-br-rs, var(--_ctm-dn-et-pe-br-rs))
1959
- );
1960
-
1961
- box-shadow: var(
1962
- --_show-shadow,
1963
- var(--_ctm-mob-dn-et-pe-sw-ae, var(--_ctm-tab-dn-et-pe-sw-ae, var(--_ctm-dn-et-pe-sw-ae)))
1964
- var(
1965
- --_ctm-mob-dn-et-pe-sw-br,
1966
- var(--_ctm-tab-dn-et-pe-sw-br, var(--_ctm-dn-et-pe-sw-br))
1967
- )
1968
- var(
1969
- --_ctm-mob-dn-et-pe-sw-sd,
1970
- var(--_ctm-tab-dn-et-pe-sw-sd, var(--_ctm-dn-et-pe-sw-sd))
1971
- )
1972
- var(
1973
- --_ctm-mob-dn-et-pe-sw-cr,
1974
- var(--_ctm-tab-dn-et-pe-sw-cr, var(--_ctm-dn-et-pe-sw-cr))
1975
- )
1976
- );
1977
- }
1978
- }
1979
- .price-text-element {
1980
- // background-color: var(--_ctm-dn-bd-cr, var(--_tst-dn-bd-cr));
1981
- padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
1982
- display: flex;
1983
- flex-direction: column;
1984
- gap: 10px;
1985
- --_sf-cd-gp: calc(var(--_sf-gp) * 0.5);
1986
- // row-gap: var(--_sf-gp);
1987
- width: 100%;
1988
- // height: 100%;
1989
- border-color: var(--_ctm-mob-dn-br-cr, var(--_ctm-tab-dn-br-cr, var(--_ctm-dn-br-cr)));
1990
- border-style: var(--_ctm-mob-dn-br-se, var(--_ctm-tab-dn-br-se, var(--_ctm-dn-br-se)));
1991
- border-width: var(--_ctm-mob-dn-br-wh, var(--_ctm-tab-dn-br-wh, var(--_ctm-dn-br-wh)));
1992
- border-radius: var(--_ctm-mob-dn-br-rs, var(--_ctm-tab-dn-br-rs, var(--_ctm-dn-br-rs)));
1993
- box-shadow: var(
1994
- --_show-shadow,
1995
- var(--_ctm-mob-dn-sw-ae, var(--_ctm-tab-dn-sw-ae, var(--_ctm-dn-sw-ae)))
1996
- var(--_ctm-mob-dn-sw-br, var(--_ctm-tab-dn-sw-br, var(--_ctm-dn-sw-br)))
1997
- var(--_ctm-mob-dn-sw-sd, var(--_ctm-tab-dn-sw-sd, var(--_ctm-dn-sw-sd)))
1998
- var(--_ctm-mob-dn-sw-cr, var(--_ctm-tab-dn-sw-cr, var(--_ctm-dn-sw-cr)))
1999
- );
2000
-
2001
- // transform: scale(var(--_ctm-dn-zm-ie));
2002
- scale: var(--_ctm-mob-dn-zm-ie, var(--_ctm-tab-dn-zm-ie, var(--_ctm-dn-zm-ie)));
2003
-
2004
- &[data-flip-x="true"] {
2005
- transform: scaleX(-1);
2006
- }
2007
- &[data-flip-y="true"] {
2008
- transform: scaleY(-1);
2009
- }
2010
- .meta_text_element {
2011
- color: green;
2012
- //styleName: Text md/Medium;
2013
- font-family: Lato;
2014
- font-size: 16px;
2015
- font-weight: 500;
2016
- line-height: 24px;
2017
- text-align: left;
2018
- text-underline-position: from-font;
2019
- text-decoration-skip-ink: none;
2020
- }
2021
- .price-container {
2022
- display: flex;
2023
- align-items: center;
2024
- gap: 5px;
2025
- .element-container {
2026
- display: flex;
2027
- align-items: flex-start;
2028
- gap: 10px;
2029
- flex-direction: column;
2030
- width: 100%;
2031
- }
2032
-
2033
- // Tooltip SCSS Style Starts Here -
2034
- .tooltipWrapper {
2035
- position: relative;
2036
- display: inline-block;
2037
- cursor: pointer;
2038
- &:hover {
2039
- .tooltipBox {
2040
- opacity: 1;
2041
- }
2042
- }
2043
- }
2044
-
2045
- .tooltipBox {
2046
- position: absolute;
2047
- z-index: 1000;
2048
- background-color: #333;
2049
- color: #fff;
2050
- padding: 8px 12px;
2051
- border-radius: 4px;
2052
- font-size: 12px;
2053
- white-space: nowrap;
2054
- visibility: visible;
2055
- opacity: 0;
2056
- transition: opacity 0.2s ease;
2057
-
2058
- max-width: 250px;
2059
- width: max-content;
2060
- max-height: 100px;
2061
- word-wrap: break-word;
2062
- white-space: normal;
2063
-
2064
- &.top {
2065
- bottom: 100%;
2066
- left: 50%;
2067
- transform: translateX(-50%);
2068
- margin-bottom: 8px;
2069
- }
2070
-
2071
- &.top-left {
2072
- bottom: 100%;
2073
- left: 0;
2074
- transform: translateX(0);
2075
- margin-bottom: 8px;
2076
- }
2077
-
2078
- &.top-right {
2079
- bottom: 100%;
2080
- right: 0;
2081
- transform: translateX(0);
2082
- margin-bottom: 8px;
2083
- }
2084
-
2085
- &.top-center {
2086
- bottom: 100%;
2087
- left: 50%;
2088
- transform: translateX(-50%);
2089
- margin-bottom: 8px;
2090
- }
2091
-
2092
- &.bottom {
2093
- top: 100%;
2094
- left: 50%;
2095
- transform: translateX(-50%);
2096
- margin-top: 8px;
2097
- }
2098
-
2099
- &.bottom-left {
2100
- top: 100%;
2101
- left: 0;
2102
- transform: translateX(0);
2103
- margin-top: 8px;
2104
- }
2105
-
2106
- &.bottom-right {
2107
- top: 100%;
2108
- right: 0;
2109
- transform: translateX(0);
2110
- margin-top: 8px;
2111
- }
2112
-
2113
- &.bottom-center {
2114
- top: 100%;
2115
- left: 50%;
2116
- transform: translateX(-50%);
2117
- margin-top: 8px;
2118
- }
2119
-
2120
- &.left {
2121
- right: 100%;
2122
- top: 50%;
2123
- transform: translateY(-50%);
2124
- margin-right: 8px;
2125
- }
2126
-
2127
- &.left-top {
2128
- right: 100%;
2129
- top: 0;
2130
- transform: translateY(0);
2131
- margin-right: 8px;
2132
- }
2133
-
2134
- &.left-center {
2135
- right: 100%;
2136
- top: 50%;
2137
- transform: translateY(-50%);
2138
- margin-right: 8px;
2139
- }
2140
-
2141
- &.left-bottom {
2142
- right: 100%;
2143
- bottom: 0;
2144
- transform: translateY(0);
2145
- margin-right: 8px;
2146
- }
2147
-
2148
- &.right {
2149
- left: 100%;
2150
- top: 50%;
2151
- transform: translateY(-50%);
2152
- margin-left: 8px;
2153
- }
2154
-
2155
- &.right-top {
2156
- left: 100%;
2157
- top: 0;
2158
- transform: translateY(0);
2159
- margin-left: 8px;
2160
- }
2161
-
2162
- &.right-center {
2163
- left: 100%;
2164
- top: 50%;
2165
- transform: translateY(-50%);
2166
- margin-left: 8px;
2167
- }
2168
-
2169
- &.right-bottom {
2170
- left: 100%;
2171
- bottom: 0;
2172
- transform: translateY(0);
2173
- margin-left: 8px;
2174
- }
2175
- .total-price-container {
2176
- .tax-box {
2177
- display: flex;
2178
- align-items: center;
2179
- justify-content: space-between;
2180
- gap: 5px;
2181
-
2182
- background-color: var(
2183
- --_ctm-mob-dn-pt-tx-bd-cr,
2184
- var(--_ctm-tab-dn-pt-tx-bd-cr, var(--_ctm-dn-pt-tx-bd-cr))
2185
- );
2186
- color: var(
2187
- --_ctm-mob-dn-pt-tx-cr,
2188
- var(--_ctm-tab-dn-pt-tx-cr, var(--_ctm-dn-pt-tx-cr))
2189
- );
2190
- font-family: var(
2191
- --_ctm-mob-dn-pt-tx-ft-fy,
2192
- var(--_ctm-tab-dn-pt-tx-ft-fy, var(--_ctm-dn-pt-tx-ft-fy))
2193
- );
2194
- font-size: var(
2195
- --_ctm-mob-dn-pt-tx-ft-se,
2196
- var(--_ctm-tab-dn-pt-tx-ft-se, var(--_ctm-dn-pt-tx-ft-se))
2197
- );
2198
- font-weight: var(
2199
- --_ctm-mob-dn-pt-tx-ft-wt,
2200
- var(--_ctm-tab-dn-pt-tx-ft-wt, var(--_ctm-dn-pt-tx-ft-wt))
2201
- );
2202
- font-style: var(
2203
- --_ctm-mob-dn-pt-tx-ft-se-ic,
2204
- var(--_ctm-tab-dn-pt-tx-ft-se-ic, var(--_ctm-dn-pt-tx-ft-se-ic))
2205
- );
2206
- text-align: var(
2207
- --_ctm-mob-dn-pt-tx-tt-an,
2208
- var(--_ctm-tab-dn-pt-tx-tt-an, var(--_ctm-dn-pt-tx-tt-an))
2209
- );
2210
- letter-spacing: var(
2211
- --_ctm-mob-dn-pt-tx-lr-sg,
2212
- var(--_ctm-tab-dn-pt-tx-lr-sg, var(--_ctm-dn-pt-tx-lr-sg))
2213
- );
2214
- line-height: var(
2215
- --_ctm-mob-dn-pt-tx-le-ht,
2216
- var(--_ctm-tab-dn-pt-tx-le-ht, var(--_ctm-dn-pt-tx-le-ht))
2217
- );
2218
- text-decoration: var(
2219
- --_ctm-mob-dn-pt-tx-ue,
2220
- var(--_ctm-tab-dn-pt-tx-ue, var(--_ctm-dn-pt-tx-ue))
2221
- );
2222
-
2223
- border-color: var(
2224
- --_show-border,
2225
- var(
2226
- --_ctm-mob-dn-pt-tx-br-cr,
2227
- var(--_ctm-tab-dn-pt-tx-br-cr, var(--_ctm-dn-pt-tx-br-cr))
2228
- )
2229
- );
2230
- border-style: var(
2231
- --_show-border,
2232
- var(
2233
- --_ctm-mob-dn-pt-tx-br-se,
2234
- var(--_ctm-tab-dn-pt-tx-br-se, var(--_ctm-dn-pt-tx-br-se))
2235
- )
2236
- );
2237
- border-width: var(
2238
- --_show-border,
2239
- var(
2240
- --_ctm-mob-dn-pt-tx-br-wh,
2241
- var(--_ctm-tab-dn-pt-tx-br-wh, var(--_ctm-dn-pt-tx-br-wh))
2242
- )
2243
- );
2244
- border-radius: var(
2245
- --_ctm-mob-dn-pt-tx-br-rs,
2246
- var(--_ctm-tab-dn-pt-tx-br-rs, var(--_ctm-dn-pt-tx-br-rs))
2247
- );
2248
-
2249
- box-shadow: var(
2250
- --_show-shadow,
2251
- var(
2252
- --_ctm-mob-dn-pt-tx-sw-ae,
2253
- var(--_ctm-tab-dn-pt-tx-sw-ae, var(--_ctm-dn-pt-tx-sw-ae))
2254
- )
2255
- var(
2256
- --_ctm-mob-dn-pt-tx-sw-br,
2257
- var(--_ctm-tab-dn-pt-tx-sw-br, var(--_ctm-dn-pt-tx-sw-br))
2258
- )
2259
- var(
2260
- --_ctm-mob-dn-pt-tx-sw-sd,
2261
- var(--_ctm-tab-dn-pt-tx-sw-sd, var(--_ctm-dn-pt-tx-sw-sd))
2262
- )
2263
- var(
2264
- --_ctm-mob-dn-pt-tx-sw-cr,
2265
- var(--_ctm-tab-dn-pt-tx-sw-cr, var(--_ctm-dn-pt-tx-sw-cr))
2266
- )
2267
- );
2268
- }
2269
-
2270
- .shipping-box {
2271
- display: flex;
2272
- align-items: center;
2273
- justify-content: space-between;
2274
- gap: 5px;
2275
-
2276
- background-color: var(
2277
- --_ctm-mob-dn-pt-sg-pe-bd-cr,
2278
- var(--_ctm-tab-dn-pt-sg-pe-bd-cr, var(--_ctm-dn-pt-sg-pe-bd-cr))
2279
- );
2280
- color: var(
2281
- --_ctm-mob-dn-pt-sg-pe-cr,
2282
- var(--_ctm-tab-dn-pt-sg-pe-cr, var(--_ctm-dn-pt-sg-pe-cr))
2283
- );
2284
- font-family: var(
2285
- --_ctm-mob-dn-pt-sg-pe-ft-fy,
2286
- var(--_ctm-tab-dn-pt-sg-pe-ft-fy, var(--_ctm-dn-pt-sg-pe-ft-fy))
2287
- );
2288
- font-size: var(
2289
- --_ctm-mob-dn-pt-sg-pe-ft-se,
2290
- var(--_ctm-tab-dn-pt-sg-pe-ft-se, var(--_ctm-dn-pt-sg-pe-ft-se))
2291
- );
2292
- font-weight: var(
2293
- --_ctm-mob-dn-pt-sg-pe-ft-wt,
2294
- var(--_ctm-tab-dn-pt-sg-pe-ft-wt, var(--_ctm-dn-pt-sg-pe-ft-wt))
2295
- );
2296
- font-style: var(
2297
- --_ctm-mob-dn-pt-sg-pe-ft-se-ic,
2298
- var(--_ctm-tab-dn-pt-sg-pe-ft-se-ic, var(--_ctm-dn-pt-sg-pe-ft-se-ic))
2299
- );
2300
- text-align: var(
2301
- --_ctm-mob-dn-pt-sg-pe-tt-an,
2302
- var(--_ctm-tab-dn-pt-sg-pe-tt-an, var(--_ctm-dn-pt-sg-pe-tt-an))
2303
- );
2304
- letter-spacing: var(
2305
- --_ctm-mob-dn-pt-sg-pe-lr-sg,
2306
- var(--_ctm-tab-dn-pt-sg-pe-lr-sg, var(--_ctm-dn-pt-sg-pe-lr-sg))
2307
- );
2308
- line-height: var(
2309
- --_ctm-mob-dn-pt-sg-pe-le-ht,
2310
- var(--_ctm-tab-dn-pt-sg-pe-le-ht, var(--_ctm-dn-pt-sg-pe-le-ht))
2311
- );
2312
- text-decoration: var(
2313
- --_ctm-mob-dn-pt-sg-pe-ue,
2314
- var(--_ctm-tab-dn-pt-sg-pe-ue, var(--_ctm-dn-pt-sg-pe-ue))
2315
- );
2316
-
2317
- border-color: var(
2318
- --_show-border,
2319
- var(
2320
- --_ctm-mob-dn-pt-sg-pe-br-cr,
2321
- var(--_ctm-tab-dn-pt-sg-pe-br-cr, var(--_ctm-dn-pt-sg-pe-br-cr))
2322
- )
2323
- );
2324
- border-style: var(
2325
- --_show-border,
2326
- var(
2327
- --_ctm-mob-dn-pt-sg-pe-br-se,
2328
- var(--_ctm-tab-dn-pt-sg-pe-br-se, var(--_ctm-dn-pt-sg-pe-br-se))
2329
- )
2330
- );
2331
- border-width: var(
2332
- --_show-border,
2333
- var(
2334
- --_ctm-mob-dn-pt-sg-pe-br-wh,
2335
- var(--_ctm-tab-dn-pt-sg-pe-br-wh, var(--_ctm-dn-pt-sg-pe-br-wh))
2336
- )
2337
- );
2338
- border-radius: var(
2339
- --_ctm-mob-dn-pt-sg-pe-br-rs,
2340
- var(--_ctm-tab-dn-pt-sg-pe-br-rs, var(--_ctm-dn-pt-sg-pe-br-rs))
2341
- );
2342
-
2343
- box-shadow: var(
2344
- --_show-shadow,
2345
- var(
2346
- --_ctm-mob-dn-pt-sg-pe-sw-ae,
2347
- var(--_ctm-tab-dn-pt-sg-pe-sw-ae, var(--_ctm-dn-pt-sg-pe-sw-ae))
2348
- )
2349
- var(
2350
- --_ctm-mob-dn-pt-sg-pe-sw-br,
2351
- var(--_ctm-tab-dn-pt-sg-pe-sw-br, var(--_ctm-dn-pt-sg-pe-sw-br))
2352
- )
2353
- var(
2354
- --_ctm-mob-dn-pt-sg-pe-sw-sd,
2355
- var(--_ctm-tab-dn-pt-sg-pe-sw-sd, var(--_ctm-dn-pt-sg-pe-sw-sd))
2356
- )
2357
- var(
2358
- --_ctm-mob-dn-pt-sg-pe-sw-cr,
2359
- var(--_ctm-tab-dn-pt-sg-pe-sw-cr, var(--_ctm-dn-pt-sg-pe-sw-cr))
2360
- )
2361
- );
2362
- }
2363
-
2364
- .embellishment-box {
2365
- display: flex;
2366
- align-items: center;
2367
- justify-content: space-between;
2368
- gap: 5px;
2369
-
2370
- background-color: var(
2371
- --_ctm-mob-dn-et-pe-bd-cr,
2372
- var(--_ctm-tab-dn-et-pe-bd-cr, var(--_ctm-dn-et-pe-bd-cr))
2373
- );
2374
- color: var(
2375
- --_ctm-mob-dn-et-pe-cr,
2376
- var(--_ctm-tab-dn-et-pe-cr, var(--_ctm-dn-et-pe-cr))
2377
- );
2378
- font-family: var(
2379
- --_ctm-mob-dn-et-pe-ft-fy,
2380
- var(--_ctm-tab-dn-et-pe-ft-fy, var(--_ctm-dn-et-pe-ft-fy))
2381
- );
2382
- font-size: var(
2383
- --_ctm-mob-dn-et-pe-ft-se,
2384
- var(--_ctm-tab-dn-et-pe-ft-se, var(--_ctm-dn-et-pe-ft-se))
2385
- );
2386
- font-weight: var(
2387
- --_ctm-mob-dn-et-pe-ft-wt,
2388
- var(--_ctm-tab-dn-et-pe-ft-wt, var(--_ctm-dn-et-pe-ft-wt))
2389
- );
2390
- font-style: var(
2391
- --_ctm-mob-dn-et-pe-ft-se-ic,
2392
- var(--_ctm-tab-dn-et-pe-ft-se-ic, var(--_ctm-dn-et-pe-ft-se-ic))
2393
- );
2394
- text-align: var(
2395
- --_ctm-mob-dn-et-pe-tt-an,
2396
- var(--_ctm-tab-dn-et-pe-tt-an, var(--_ctm-dn-et-pe-tt-an))
2397
- );
2398
- letter-spacing: var(
2399
- --_ctm-mob-dn-et-pe-lr-sg,
2400
- var(--_ctm-tab-dn-et-pe-lr-sg, var(--_ctm-dn-et-pe-lr-sg))
2401
- );
2402
- line-height: var(
2403
- --_ctm-mob-dn-et-pe-le-ht,
2404
- var(--_ctm-tab-dn-et-pe-le-ht, var(--_ctm-dn-et-pe-le-ht))
2405
- );
2406
- text-decoration: var(
2407
- --_ctm-mob-dn-et-pe-ue,
2408
- var(--_ctm-tab-dn-et-pe-ue, var(--_ctm-dn-et-pe-ue))
2409
- );
2410
-
2411
- border-color: var(
2412
- --_show-border,
2413
- var(
2414
- --_ctm-mob-dn-et-pe-br-cr,
2415
- var(--_ctm-tab-dn-et-pe-br-cr, var(--_ctm-dn-et-pe-br-cr))
2416
- )
2417
- );
2418
- border-style: var(
2419
- --_show-border,
2420
- var(
2421
- --_ctm-mob-dn-et-pe-br-se,
2422
- var(--_ctm-tab-dn-et-pe-br-se, var(--_ctm-dn-et-pe-br-se))
2423
- )
2424
- );
2425
- border-width: var(
2426
- --_show-border,
2427
- var(
2428
- --_ctm-mob-dn-et-pe-br-wh,
2429
- var(--_ctm-tab-dn-et-pe-br-wh, var(--_ctm-dn-et-pe-br-wh))
2430
- )
2431
- );
2432
- border-radius: var(
2433
- --_ctm-mob-dn-et-pe-br-rs,
2434
- var(--_ctm-tab-dn-et-pe-br-rs, var(--_ctm-dn-et-pe-br-rs))
2435
- );
2436
-
2437
- box-shadow: var(
2438
- --_show-shadow,
2439
- var(
2440
- --_ctm-mob-dn-et-pe-sw-ae,
2441
- var(--_ctm-tab-dn-et-pe-sw-ae, var(--_ctm-dn-et-pe-sw-ae))
2442
- )
2443
- var(
2444
- --_ctm-mob-dn-et-pe-sw-br,
2445
- var(--_ctm-tab-dn-et-pe-sw-br, var(--_ctm-dn-et-pe-sw-br))
2446
- )
2447
- var(
2448
- --_ctm-mob-dn-et-pe-sw-sd,
2449
- var(--_ctm-tab-dn-et-pe-sw-sd, var(--_ctm-dn-et-pe-sw-sd))
2450
- )
2451
- var(
2452
- --_ctm-mob-dn-et-pe-sw-cr,
2453
- var(--_ctm-tab-dn-et-pe-sw-cr, var(--_ctm-dn-et-pe-sw-cr))
2454
- )
2455
- );
2456
- }
2457
- }
2458
- }
2459
-
2460
- .tooltipArrow {
2461
- position: absolute;
2462
- width: 0;
2463
- height: 0;
2464
- border-style: solid;
2465
-
2466
- &.top {
2467
- bottom: -4px;
2468
- left: 50%;
2469
- transform: translateX(-50%);
2470
- border-width: 4px 4px 0 4px;
2471
- border-color: #333 transparent transparent transparent;
2472
- }
2473
-
2474
- &.top-left {
2475
- bottom: -4px;
2476
- left: 10px;
2477
- transform: translateX(0);
2478
- border-width: 4px 4px 0 4px;
2479
- border-color: #333 transparent transparent transparent;
2480
- }
2481
-
2482
- &.top-right {
2483
- bottom: -4px;
2484
- right: 10px;
2485
- transform: translateX(0);
2486
- border-width: 4px 4px 0 4px;
2487
- border-color: #333 transparent transparent transparent;
2488
- }
2489
-
2490
- &.top-center {
2491
- bottom: -4px;
2492
- left: 50%;
2493
- transform: translateX(-50%);
2494
- border-width: 4px 4px 0 4px;
2495
- border-color: #333 transparent transparent transparent;
2496
- }
2497
-
2498
- &.bottom {
2499
- top: -4px;
2500
- left: 50%;
2501
- transform: translateX(-50%);
2502
- border-width: 0 4px 4px 4px;
2503
- border-color: transparent transparent #333 transparent;
2504
- }
2505
-
2506
- &.bottom-left {
2507
- top: -4px;
2508
- left: 10px;
2509
- transform: translateX(0);
2510
- border-width: 0 4px 4px 4px;
2511
- border-color: transparent transparent #333 transparent;
2512
- }
2513
-
2514
- &.bottom-right {
2515
- top: -4px;
2516
- right: 10px;
2517
- transform: translateX(0);
2518
- border-width: 0 4px 4px 4px;
2519
- border-color: transparent transparent #333 transparent;
2520
- }
2521
-
2522
- &.bottom-center {
2523
- top: -4px;
2524
- left: 50%;
2525
- transform: translateX(-50%);
2526
- border-width: 0 4px 4px 4px;
2527
- border-color: transparent transparent #333 transparent;
2528
- }
2529
-
2530
- &.left {
2531
- right: -4px;
2532
- top: 50%;
2533
- transform: translateY(-50%);
2534
- border-width: 4px 0 4px 4px;
2535
- border-color: transparent transparent transparent #333;
2536
- }
2537
-
2538
- &.left-top {
2539
- right: -4px;
2540
- top: 10px;
2541
- transform: translateY(0);
2542
- border-width: 4px 0 4px 4px;
2543
- border-color: transparent transparent transparent #333;
2544
- }
2545
-
2546
- &.left-center {
2547
- right: -4px;
2548
- top: 50%;
2549
- transform: translateY(-50%);
2550
- border-width: 4px 0 4px 4px;
2551
- border-color: transparent transparent transparent #333;
2552
- }
2553
-
2554
- &.left-bottom {
2555
- right: -4px;
2556
- bottom: 10px;
2557
- transform: translateY(0);
2558
- border-width: 4px 0 4px 4px;
2559
- border-color: transparent transparent transparent #333;
2560
- }
2561
-
2562
- &.right {
2563
- left: -4px;
2564
- top: 50%;
2565
- transform: translateY(-50%);
2566
- border-width: 4px 4px 4px 0;
2567
- border-color: transparent #333 transparent transparent;
2568
- }
2569
-
2570
- &.right-top {
2571
- left: -4px;
2572
- top: 10px;
2573
- transform: translateY(0);
2574
- border-width: 4px 4px 4px 0;
2575
- border-color: transparent #333 transparent transparent;
2576
- }
2577
-
2578
- &.right-center {
2579
- left: -4px;
2580
- top: 50%;
2581
- transform: translateY(-50%);
2582
- border-width: 4px 4px 4px 0;
2583
- border-color: transparent #333 transparent transparent;
2584
- }
2585
-
2586
- &.right-bottom {
2587
- left: -4px;
2588
- bottom: 10px;
2589
- transform: translateY(0);
2590
- border-width: 4px 4px 4px 0;
2591
- border-color: transparent #333 transparent transparent;
2592
- }
2593
- }
2594
- // Tooltip SCSS Style Ends Here -
2595
- }
2596
- }
2597
- }
2598
- }
1
+ @use "sass:map";
2
+ @use "sass:list";
3
+ @use "./functions.scss";
4
+
5
+ [data-div-type="element"] {
6
+ &[data-element-type="productPrice"] {
7
+ // width: var(--_lt-wh);
8
+ // height: var(--_lt-ht);
9
+ // margin: var(--_lt-mn);
10
+ // padding: var(--_lt-pg);
11
+ // width: var(--_ctm-lt-wh, var(--_tst-lt-wh));
12
+ // width: var(--_sf-nw-wh, var(--_tst-lt-wh));
13
+ // width: var(--_ctm-ele-nw-wh-vl);
14
+ //width: var(--_sf-el-wh-st-mx, calc(1% * var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))));
15
+ //margin: var(--_ctm-lt-mn, --_tst-lt-mn);
16
+ width: var(
17
+ --_sf-el-wh-st-mx,
18
+ calc(
19
+ 1% * var(--_ctm-mob-ele-nw-wh-vl, var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl)))
20
+ )
21
+ );
22
+ margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));
23
+ // height: var(--_ctm-lt-ht, var(--_tst-lt-ht));
24
+ // height: ;
25
+ // aspect-ratio: 1 / var(--_sf-aspect-ratio);
26
+ // --_aspect-ratio: calc(
27
+ // 1 * (var(--_ctm-lt-ht, var(--_tst-lt-ht)) / var(--_ctm-lt-wh, var(--_tst-lt-wh)))
28
+ // );
29
+
30
+ & > .wrapper {
31
+ width: 100%;
32
+ // height: 100%;
33
+ }
34
+ &[data-show-shadow="false"] {
35
+ --_show-shadow: none;
36
+ }
37
+ .text-element {
38
+ // background: #6d96e4;
39
+ // padding: 10px;
40
+ // font-weight: 600;
41
+ // color: rgba(75, 69, 70, 1);
42
+ color: var(--Gray-900, #101828);
43
+ font-family: "Hanken Grotesk";
44
+ font-size: 32px;
45
+ font-style: normal;
46
+ font-weight: 700;
47
+ line-height: 150%; /* 48px */
48
+ }
49
+
50
+ .product-price {
51
+ display: flex;
52
+ flex-direction: column;
53
+ width: 100%;
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
+
72
+ box-shadow: var(
73
+ --_show-shadow,
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)))
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
+ }
92
+
93
+ @keyframes shimmer {
94
+ 0% {
95
+ background-position: -200% 0;
96
+ }
97
+ 100% {
98
+ background-position: 200% 0;
99
+ }
100
+ }
101
+
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: var(
105
+ --_ctm-mob-dn-pt-pe-ft-fy,
106
+ var(--_ctm-tab-dn-pt-pe-ft-fy, var(--_ctm-dn-pt-pe-ft-fy))
107
+ );
108
+ font-size: var(
109
+ --_ctm-mob-dn-pt-pe-ft-se,
110
+ var(--_ctm-tab-dn-pt-pe-ft-se, var(--_ctm-dn-pt-pe-ft-se))
111
+ );
112
+ font-weight: var(
113
+ --_ctm-mob-dn-pt-pe-ft-wt,
114
+ var(--_ctm-tab-dn-pt-pe-ft-wt, var(--_ctm-dn-pt-pe-ft-wt))
115
+ );
116
+ font-style: var(
117
+ --_ctm-mob-dn-pt-pe-ft-se-ic,
118
+ var(--_ctm-tab-dn-pt-pe-ft-se-ic, var(--_ctm-dn-pt-pe-ft-se-ic))
119
+ );
120
+ text-align: var(
121
+ --_ctm-mob-dn-pt-pe-tt-an,
122
+ var(--_ctm-tab-dn-pt-pe-tt-an, var(--_ctm-dn-pt-pe-tt-an))
123
+ );
124
+ letter-spacing: var(
125
+ --_ctm-mob-dn-pt-pe-lr-sg,
126
+ var(--_ctm-tab-dn-pt-pe-lr-sg, var(--_ctm-dn-pt-pe-lr-sg))
127
+ );
128
+ line-height: var(
129
+ --_ctm-mob-dn-pt-pe-le-ht,
130
+ var(--_ctm-tab-dn-pt-pe-le-ht, var(--_ctm-dn-pt-pe-le-ht))
131
+ );
132
+ text-decoration: var(
133
+ --_ctm-mob-dn-pt-pe-ue,
134
+ var(--_ctm-tab-dn-pt-pe-ue, var(--_ctm-dn-pt-pe-ue))
135
+ );
136
+ }
137
+ .strike-price {
138
+ color: var(
139
+ --_ctm-mob-dn-pt-pe-cr-dc,
140
+ var(--_ctm-tab-dn-pt-pe-cr-dc, var(--_ctm-dn-pt-pe-cr-dc))
141
+ );
142
+ font-family: var(
143
+ --_sf-hr-ff,
144
+ var(
145
+ --_ctm-mob-dn-pt-pe-ft-fy-dc,
146
+ var(--_ctm-tab-dn-pt-pe-ft-fy-dc, var(--_ctm-dn-pt-pe-ft-fy-dc))
147
+ )
148
+ );
149
+ font-size: var(
150
+ --_ctm-mob-dn-pt-pe-ft-se-dc,
151
+ var(--_ctm-tab-dn-pt-pe-ft-se-dc, var(--_ctm-dn-pt-pe-ft-se-dc))
152
+ );
153
+ font-weight: var(
154
+ --_ctm-mob-dn-pt-pe-ft-wt-dc,
155
+ var(--_ctm-tab-dn-pt-pe-ft-wt-dc, var(--_ctm-dn-pt-pe-ft-wt-dc))
156
+ );
157
+ font-style: var(
158
+ --_ctm-mob-dn-pt-pe-ft-se-ic-dc,
159
+ var(--_ctm-tab-dn-pt-pe-ft-se-ic-dc, var(--_ctm-dn-pt-pe-ft-se-ic-dc))
160
+ );
161
+ text-align: var(
162
+ --_ctm-mob-dn-pt-pe-tt-an-dc,
163
+ var(--_ctm-tab-dn-pt-pe-tt-an-dc, var(--_ctm-dn-pt-pe-tt-an-dc))
164
+ );
165
+ letter-spacing: var(
166
+ --_ctm-mob-dn-pt-pe-lr-sg-dc,
167
+ var(--_ctm-tab-dn-pt-pe-lr-sg-dc, var(--_ctm-dn-pt-pe-lr-sg-dc))
168
+ );
169
+ line-height: var(
170
+ --_ctm-mob-dn-pt-pe-le-ht-dc,
171
+ var(--_ctm-tab-dn-pt-pe-le-ht-dc, var(--_ctm-dn-pt-pe-le-ht-dc))
172
+ );
173
+ text-decoration: var(
174
+ --_ctm-mob-dn-pt-pe-ue-dc,
175
+ var(--_ctm-tab-dn-pt-pe-ue-dc, var(--_ctm-dn-pt-pe-ue-dc))
176
+ );
177
+ }
178
+
179
+ .code-span {
180
+ background-color: var(
181
+ --_ctm-mob-dn-cy-ce-se-bd-cr,
182
+ var(--_ctm-tab-dn-cy-ce-se-bd-cr, var(--_ctm-dn-cy-ce-se-bd-cr))
183
+ );
184
+ color: var(
185
+ --_ctm-mob-dn-cy-ce-se-cr,
186
+ var(--_ctm-tab-dn-cy-ce-se-cr, var(--_ctm-dn-cy-ce-se-cr))
187
+ );
188
+ font-family: var(
189
+ --_ctm-mob-dn-cy-ce-se-ft-fy,
190
+ var(--_ctm-tab-dn-cy-ce-se-ft-fy, var(--_ctm-dn-cy-ce-se-ft-fy))
191
+ );
192
+ font-size: var(
193
+ --_ctm-mob-dn-cy-ce-se-ft-se,
194
+ var(--_ctm-tab-dn-cy-ce-se-ft-se, var(--_ctm-dn-cy-ce-se-ft-se))
195
+ );
196
+ font-weight: var(
197
+ --_ctm-mob-dn-cy-ce-se-ft-wt,
198
+ var(--_ctm-tab-dn-cy-ce-se-ft-wt, var(--_ctm-dn-cy-ce-se-ft-wt))
199
+ );
200
+ font-style: var(
201
+ --_ctm-mob-dn-cy-ce-se-ft-se-ic,
202
+ var(--_ctm-tab-dn-cy-ce-se-ft-se-ic, var(--_ctm-dn-cy-ce-se-ft-se-ic))
203
+ );
204
+ text-align: var(
205
+ --_ctm-mob-dn-cy-ce-se-tt-an,
206
+ var(--_ctm-tab-dn-cy-ce-se-tt-an, var(--_ctm-dn-cy-ce-se-tt-an))
207
+ );
208
+ letter-spacing: var(
209
+ --_ctm-mob-dn-cy-ce-se-lr-sg,
210
+ var(--_ctm-tab-dn-cy-ce-se-lr-sg, var(--_ctm-dn-cy-ce-se-lr-sg))
211
+ );
212
+ line-height: var(
213
+ --_ctm-mob-dn-cy-ce-se-le-ht,
214
+ var(--_ctm-tab-dn-cy-ce-se-le-ht, var(--_ctm-dn-cy-ce-se-le-ht))
215
+ );
216
+ text-decoration: var(
217
+ --_ctm-mob-dn-cy-ce-se-ue,
218
+ var(--_ctm-tab-dn-cy-ce-se-ue, var(--_ctm-dn-cy-ce-se-ue))
219
+ );
220
+
221
+ border-color: var(
222
+ --_show-border,
223
+ var(
224
+ --_ctm-mob-dn-cy-ce-se-br-cr,
225
+ var(--_ctm-tab-dn-cy-ce-se-br-cr, var(--_ctm-dn-cy-ce-se-br-cr))
226
+ )
227
+ );
228
+ border-style: var(
229
+ --_show-border,
230
+ var(
231
+ --_ctm-mob-dn-cy-ce-se-br-se,
232
+ var(--_ctm-tab-dn-cy-ce-se-br-se, var(--_ctm-dn-cy-ce-se-br-se))
233
+ )
234
+ );
235
+ border-width: var(
236
+ --_show-border,
237
+ var(
238
+ --_ctm-mob-dn-cy-ce-se-br-wh,
239
+ var(--_ctm-tab-dn-cy-ce-se-br-wh, var(--_ctm-dn-cy-ce-se-br-wh))
240
+ )
241
+ );
242
+ border-radius: var(
243
+ --_ctm-mob-dn-cy-ce-se-br-rs,
244
+ var(--_ctm-tab-dn-cy-ce-se-br-rs, var(--_ctm-dn-cy-ce-se-br-rs))
245
+ );
246
+
247
+ box-shadow: var(
248
+ --_show-shadow,
249
+ var(
250
+ --_ctm-mob-dn-cy-ce-se-sw-ae,
251
+ var(--_ctm-tab-dn-cy-ce-se-sw-ae, var(--_ctm-dn-cy-ce-se-sw-ae))
252
+ )
253
+ var(
254
+ --_ctm-mob-dn-cy-ce-se-sw-br,
255
+ var(--_ctm-tab-dn-cy-ce-se-sw-br, var(--_ctm-dn-cy-ce-se-sw-br))
256
+ )
257
+ var(
258
+ --_ctm-mob-dn-cy-ce-se-sw-sd,
259
+ var(--_ctm-tab-dn-cy-ce-se-sw-sd, var(--_ctm-dn-cy-ce-se-sw-sd))
260
+ )
261
+ var(
262
+ --_ctm-mob-dn-cy-ce-se-sw-cr,
263
+ var(--_ctm-tab-dn-cy-ce-se-sw-cr, var(--_ctm-dn-cy-ce-se-sw-cr))
264
+ )
265
+ );
266
+ }
267
+
268
+ .uom-span {
269
+ background-color: var(
270
+ --_ctm-mob-dn-um-se-bd-cr,
271
+ var(--_ctm-tab-dn-um-se-bd-cr, var(--_ctm-dn-um-se-bd-cr))
272
+ );
273
+ color: var(--_ctm-mob-dn-um-se-cr, var(--_ctm-tab-dn-um-se-cr, var(--_ctm-dn-um-se-cr)));
274
+ font-family: var(
275
+ --_ctm-mob-dn-um-se-ft-fy,
276
+ var(--_ctm-tab-dn-um-se-ft-fy, var(--_ctm-dn-um-se-ft-fy))
277
+ );
278
+ font-size: var(
279
+ --_ctm-mob-dn-um-se-ft-se,
280
+ var(--_ctm-tab-dn-um-se-ft-se, var(--_ctm-dn-um-se-ft-se))
281
+ );
282
+ font-weight: var(
283
+ --_ctm-mob-dn-um-se-ft-wt,
284
+ var(--_ctm-tab-dn-um-se-ft-wt, var(--_ctm-dn-um-se-ft-wt))
285
+ );
286
+ font-style: var(
287
+ --_ctm-mob-dn-um-se-ft-se-ic,
288
+ var(--_ctm-tab-dn-um-se-ft-se-ic, var(--_ctm-dn-um-se-ft-se-ic))
289
+ );
290
+ text-align: var(
291
+ --_ctm-mob-dn-um-se-tt-an,
292
+ var(--_ctm-tab-dn-um-se-tt-an, var(--_ctm-dn-um-se-tt-an))
293
+ );
294
+ letter-spacing: var(
295
+ --_ctm-mob-dn-um-se-lr-sg,
296
+ var(--_ctm-tab-dn-um-se-lr-sg, var(--_ctm-dn-um-se-lr-sg))
297
+ );
298
+ line-height: var(
299
+ --_ctm-mob-dn-um-se-le-ht,
300
+ var(--_ctm-tab-dn-um-se-le-ht, var(--_ctm-dn-um-se-le-ht))
301
+ );
302
+ text-decoration: var(
303
+ --_ctm-mob-dn-um-se-ue,
304
+ var(--_ctm-tab-dn-um-se-ue, var(--_ctm-dn-um-se-ue))
305
+ );
306
+
307
+ border-color: var(
308
+ --_show-border,
309
+ var(--_ctm-mob-dn-um-se-br-cr, var(--_ctm-tab-dn-um-se-br-cr, var(--_ctm-dn-um-se-br-cr)))
310
+ );
311
+ border-style: var(
312
+ --_show-border,
313
+ var(--_ctm-mob-dn-um-se-br-se, var(--_ctm-tab-dn-um-se-br-se, var(--_ctm-dn-um-se-br-se)))
314
+ );
315
+ border-width: var(
316
+ --_show-border,
317
+ var(--_ctm-mob-dn-um-se-br-wh, var(--_ctm-tab-dn-um-se-br-wh, var(--_ctm-dn-um-se-br-wh)))
318
+ );
319
+ border-radius: var(
320
+ --_ctm-mob-dn-um-se-br-rs,
321
+ var(--_ctm-tab-dn-um-se-br-rs, var(--_ctm-dn-um-se-br-rs))
322
+ );
323
+
324
+ box-shadow: var(
325
+ --_show-shadow,
326
+ var(--_ctm-mob-dn-um-se-sw-ae, var(--_ctm-tab-dn-um-se-sw-ae, var(--_ctm-dn-um-se-sw-ae)))
327
+ var(
328
+ --_ctm-mob-dn-um-se-sw-br,
329
+ var(--_ctm-tab-dn-um-se-sw-br, var(--_ctm-dn-um-se-sw-br))
330
+ )
331
+ var(
332
+ --_ctm-mob-dn-um-se-sw-sd,
333
+ var(--_ctm-tab-dn-um-se-sw-sd, var(--_ctm-dn-um-se-sw-sd))
334
+ )
335
+ var(
336
+ --_ctm-mob-dn-um-se-sw-cr,
337
+ var(--_ctm-tab-dn-um-se-sw-cr, var(--_ctm-dn-um-se-sw-cr))
338
+ )
339
+ );
340
+ }
341
+ .denominations_container {
342
+ // font-size: 16px;
343
+ display: flex;
344
+ flex-direction: column;
345
+ // gap: 6px;
346
+ // padding-bottom: 14px;
347
+
348
+ background-color: var(
349
+ --_ctm-mob-dn-gt-cd-cd-wr-bd-cr,
350
+ var(--_ctm-tab-dn-gt-cd-cd-wr-bd-cr, var(--_ctm-dn-gt-cd-cd-wr-bd-cr))
351
+ );
352
+ border-color: var(
353
+ --_ctm-mob-dn-gt-cd-cd-wr-br-cr,
354
+ var(--_ctm-tab-dn-gt-cd-cd-wr-br-cr, var(--_ctm-dn-gt-cd-cd-wr-br-cr))
355
+ );
356
+ border-radius: var(
357
+ --_ctm-mob-dn-gt-cd-cd-wr-br-rs,
358
+ var(--_ctm-tab-dn-gt-cd-cd-wr-br-rs, var(--_ctm-dn-gt-cd-cd-wr-br-rs))
359
+ );
360
+ border-style: var(
361
+ --_ctm-mob-dn-gt-cd-cd-wr-br-se,
362
+ var(--_ctm-tab-dn-gt-cd-cd-wr-br-se, var(--_ctm-dn-gt-cd-cd-wr-br-se))
363
+ );
364
+ border-width: var(
365
+ --_ctm-mob-dn-gt-cd-cd-wr-br-wh,
366
+ var(--_ctm-tab-dn-gt-cd-cd-wr-br-wh, var(--_ctm-dn-gt-cd-cd-wr-br-wh))
367
+ );
368
+ box-shadow: var(
369
+ --_ctm-mob-dn-gt-cd-cd-wr-sw-ae,
370
+ var(--_ctm-tab-dn-gt-cd-cd-wr-sw-ae, var(--_ctm-dn-gt-cd-cd-wr-sw-ae))
371
+ )
372
+ var(
373
+ --_ctm-mob-dn-gt-cd-cd-wr-sw-br,
374
+ var(--_ctm-tab-dn-gt-cd-cd-wr-sw-br, var(--_ctm-dn-gt-cd-cd-wr-sw-br))
375
+ )
376
+ var(
377
+ --_ctm-mob-dn-gt-cd-cd-wr-sw-sd,
378
+ var(--_ctm-tab-dn-gt-cd-cd-wr-sw-sd, var(--_ctm-dn-gt-cd-cd-wr-sw-sd))
379
+ )
380
+ var(
381
+ --_ctm-mob-dn-gt-cd-cd-wr-sw-cr,
382
+ var(--_ctm-tab-dn-gt-cd-cd-wr-sw-cr, var(--_ctm-dn-gt-cd-cd-wr-sw-cr))
383
+ );
384
+ padding: var(
385
+ --_ctm-mob-dn-gt-cd-cd-wr-pg,
386
+ var(--_ctm-tab-dn-gt-cd-cd-wr-pg, var(--_ctm-dn-gt-cd-cd-wr-pg))
387
+ );
388
+ gap: var(
389
+ --_ctm-mob-dn-gt-cd-cd-wr-im-gp,
390
+ var(--_ctm-tab-dn-gt-cd-cd-wr-im-gp, var(--_ctm-dn-gt-cd-cd-wr-im-gp))
391
+ );
392
+ .denominations_title {
393
+ // margin-bottom: 4px;
394
+ // font-size: 16px;
395
+ // color: #000000;
396
+ // font-weight: 500;
397
+ // line-height: 150%;
398
+ font-family: var(
399
+ --_ctm-mob-dn-gt-cd-ts-ft-fy,
400
+ var(--_ctm-tab-dn-gt-cd-ts-ft-fy, var(--_ctm-dn-gt-cd-ts-ft-fy))
401
+ );
402
+ color: var(
403
+ --_ctm-mob-dn-gt-cd-ts-cr,
404
+ var(--_ctm-tab-dn-gt-cd-ts-cr, var(--_ctm-dn-gt-cd-ts-cr))
405
+ );
406
+ font-weight: var(
407
+ --_ctm-mob-dn-gt-cd-ts-ft-wt,
408
+ var(--_ctm-tab-dn-gt-cd-ts-ft-wt, var(--_ctm-dn-gt-cd-ts-ft-wt))
409
+ );
410
+ font-size: var(
411
+ --_ctm-mob-dn-gt-cd-ts-ft-se,
412
+ var(--_ctm-tab-dn-gt-cd-ts-ft-se, var(--_ctm-dn-gt-cd-ts-ft-se))
413
+ );
414
+ text-decoration: var(
415
+ --_ctm-mob-dn-gt-cd-ts-ue,
416
+ var(--_ctm-tab-dn-gt-cd-ts-ue, var(--_ctm-dn-gt-cd-ts-ue))
417
+ );
418
+ letter-spacing: var(
419
+ --_ctm-mob-dn-gt-cd-ts-lr-sg,
420
+ var(--_ctm-tab-dn-gt-cd-ts-lr-sg, var(--_ctm-dn-gt-cd-ts-lr-sg))
421
+ );
422
+ line-height: var(
423
+ --_ctm-mob-dn-gt-cd-ts-le-ht,
424
+ var(--_ctm-tab-dn-gt-cd-ts-le-ht, var(--_ctm-dn-gt-cd-ts-le-ht))
425
+ );
426
+ font-style: var(
427
+ --_ctm-mob-dn-gt-cd-ts-ft-se-ic,
428
+ var(--_ctm-tab-dn-gt-cd-ts-ft-se-ic, var(--_ctm-dn-gt-cd-ts-ft-se-ic))
429
+ );
430
+ text-align: var(
431
+ --_ctm-mob-dn-gt-cd-ts-tt-an,
432
+ var(--_ctm-tab-dn-gt-cd-ts-tt-an, var(--_ctm-dn-gt-cd-ts-tt-an))
433
+ );
434
+ }
435
+ .denominations_grid {
436
+ display: flex;
437
+ // gap: 8px;
438
+ flex-wrap: wrap;
439
+ margin-top: 12px;
440
+ flex-direction: row;
441
+ gap: 12px;
442
+ // gap: var(
443
+ // --_ctm-mob-dn-gt-cd-cd-dt-se-im-gp,
444
+ // var(--_ctm-tab-dn-gt-cd-cd-dt-se-im-gp, var(--_ctm-dn-gt-cd-cd-dt-se-im-gp))
445
+ // );
446
+ .amount_btn {
447
+ transition: color 0.3s ease;
448
+ cursor: pointer;
449
+ display: flex;
450
+ align-items: center;
451
+ justify-content: center;
452
+ // padding: 4px;
453
+ min-width: 20px;
454
+ min-height: 20px;
455
+ box-sizing: content-box;
456
+ // font-size: 16px;
457
+ // font-weight: 600;
458
+ // line-height: 150%;
459
+ // background-color: #ffffff;
460
+ // border: 1px solid #d6d6d6;
461
+ background-color: var(
462
+ --_ctm-mob-dn-gt-cd-cd-dt-se-bd-cr,
463
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-bd-cr, var(--_ctm-dn-gt-cd-cd-dt-se-bd-cr))
464
+ );
465
+ font-family: var(
466
+ --_ctm-mob-dn-gt-cd-cd-dt-se-ft-fy,
467
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-ft-fy, var(--_ctm-dn-gt-cd-cd-dt-se-ft-fy))
468
+ );
469
+ color: var(
470
+ --_ctm-mob-dn-gt-cd-cd-dt-se-cr,
471
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-cr, var(--_ctm-dn-gt-cd-cd-dt-se-cr))
472
+ );
473
+ font-weight: var(
474
+ --_ctm-mob-dn-gt-cd-cd-dt-se-ft-wt,
475
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-ft-wt, var(--_ctm-dn-gt-cd-cd-dt-se-ft-wt))
476
+ );
477
+ font-size: var(
478
+ --_ctm-mob-dn-gt-cd-cd-dt-se-ft-se,
479
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-ft-se, var(--_ctm-dn-gt-cd-cd-dt-se-ft-se))
480
+ );
481
+ text-decoration: var(
482
+ --_ctm-mob-dn-gt-cd-cd-dt-se-ue,
483
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-ue, var(--_ctm-dn-gt-cd-cd-dt-se-ue))
484
+ );
485
+ letter-spacing: var(
486
+ --_ctm-mob-dn-gt-cd-cd-dt-se-lr-sg,
487
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-lr-sg, var(--_ctm-dn-gt-cd-cd-dt-se-lr-sg))
488
+ );
489
+ line-height: var(
490
+ --_ctm-mob-dn-gt-cd-cd-dt-se-le-ht,
491
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-le-ht, var(--_ctm-dn-gt-cd-cd-dt-se-le-ht))
492
+ );
493
+ font-style: var(
494
+ --_ctm-mob-dn-gt-cd-cd-dt-se-ft-se-ic,
495
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-ft-se-ic, var(--_ctm-dn-gt-cd-cd-dt-se-ft-se-ic))
496
+ );
497
+ text-align: var(
498
+ --_ctm-mob-dn-gt-cd-cd-dt-se-tt-an,
499
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-tt-an, var(--_ctm-dn-gt-cd-cd-dt-se-tt-an))
500
+ );
501
+ border-color: var(
502
+ --_ctm-mob-dn-gt-cd-cd-dt-se-br-cr,
503
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-br-cr, var(--_ctm-dn-gt-cd-cd-dt-se-br-cr))
504
+ );
505
+ border-radius: var(
506
+ --_ctm-mob-dn-gt-cd-cd-dt-se-br-rs,
507
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-br-rs, var(--_ctm-dn-gt-cd-cd-dt-se-br-rs))
508
+ );
509
+ border-style: var(
510
+ --_ctm-mob-dn-gt-cd-cd-dt-se-br-se,
511
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-br-se, var(--_ctm-dn-gt-cd-cd-dt-se-br-se))
512
+ );
513
+ border-width: var(
514
+ --_ctm-mob-dn-gt-cd-cd-dt-se-br-wh,
515
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-br-wh, var(--_ctm-dn-gt-cd-cd-dt-se-br-wh))
516
+ );
517
+ box-shadow: var(
518
+ --_ctm-mob-dn-gt-cd-cd-dt-se-sw-ae,
519
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-sw-ae, var(--_ctm-dn-gt-cd-cd-dt-se-sw-ae))
520
+ )
521
+ var(
522
+ --_ctm-mob-dn-gt-cd-cd-dt-se-sw-br,
523
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-sw-br, var(--_ctm-dn-gt-cd-cd-dt-se-sw-br))
524
+ )
525
+ var(
526
+ --_ctm-mob-dn-gt-cd-cd-dt-se-sw-sd,
527
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-sw-sd, var(--_ctm-dn-gt-cd-cd-dt-se-sw-sd))
528
+ )
529
+ var(
530
+ --_ctm-mob-dn-gt-cd-cd-dt-se-sw-cr,
531
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-sw-cr, var(--_ctm-dn-gt-cd-cd-dt-se-sw-cr))
532
+ );
533
+ padding: var(
534
+ --_ctm-mob-dn-gt-cd-cd-dt-se-pg,
535
+ var(--_ctm-tab-dn-gt-cd-cd-dt-se-pg, var(--_ctm-dn-gt-cd-cd-dt-se-pg))
536
+ );
537
+ &.active {
538
+ background-color: var(
539
+ --_ctm-mob-dn-gt-cd-cd-sd-se-bd-cr,
540
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-bd-cr, var(--_ctm-dn-gt-cd-cd-sd-se-bd-cr))
541
+ );
542
+ font-family: var(
543
+ --_ctm-mob-dn-gt-cd-cd-sd-se-ft-fy,
544
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-ft-fy, var(--_ctm-dn-gt-cd-cd-sd-se-ft-fy))
545
+ );
546
+ color: var(
547
+ --_ctm-mob-dn-gt-cd-cd-sd-se-cr,
548
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-cr, var(--_ctm-dn-gt-cd-cd-sd-se-cr))
549
+ );
550
+ font-weight: var(
551
+ --_ctm-mob-dn-gt-cd-cd-sd-se-ft-wt,
552
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-ft-wt, var(--_ctm-dn-gt-cd-cd-sd-se-ft-wt))
553
+ );
554
+ font-size: var(
555
+ --_ctm-mob-dn-gt-cd-cd-sd-se-ft-se,
556
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-ft-se, var(--_ctm-dn-gt-cd-cd-sd-se-ft-se))
557
+ );
558
+ text-decoration: var(
559
+ --_ctm-mob-dn-gt-cd-cd-sd-se-ue,
560
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-ue, var(--_ctm-dn-gt-cd-cd-sd-se-ue))
561
+ );
562
+ letter-spacing: var(
563
+ --_ctm-mob-dn-gt-cd-cd-sd-se-lr-sg,
564
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-lr-sg, var(--_ctm-dn-gt-cd-cd-sd-se-lr-sg))
565
+ );
566
+ line-height: var(
567
+ --_ctm-mob-dn-gt-cd-cd-sd-se-le-ht,
568
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-le-ht, var(--_ctm-dn-gt-cd-cd-sd-se-le-ht))
569
+ );
570
+ font-style: var(
571
+ --_ctm-mob-dn-gt-cd-cd-sd-se-ft-se-ic,
572
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-ft-se-ic, var(--_ctm-dn-gt-cd-cd-sd-se-ft-se-ic))
573
+ );
574
+ text-align: var(
575
+ --_ctm-mob-dn-gt-cd-cd-sd-se-tt-an,
576
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-tt-an, var(--_ctm-dn-gt-cd-cd-sd-se-tt-an))
577
+ );
578
+ border-color: var(
579
+ --_ctm-mob-dn-gt-cd-cd-sd-se-br-cr,
580
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-br-cr, var(--_ctm-dn-gt-cd-cd-sd-se-br-cr))
581
+ );
582
+ border-radius: var(
583
+ --_ctm-mob-dn-gt-cd-cd-sd-se-br-rs,
584
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-br-rs, var(--_ctm-dn-gt-cd-cd-sd-se-br-rs))
585
+ );
586
+ border-style: var(
587
+ --_ctm-mob-dn-gt-cd-cd-sd-se-br-se,
588
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-br-se, var(--_ctm-dn-gt-cd-cd-sd-se-br-se))
589
+ );
590
+ border-width: var(
591
+ --_ctm-mob-dn-gt-cd-cd-sd-se-br-wh,
592
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-br-wh, var(--_ctm-dn-gt-cd-cd-sd-se-br-wh))
593
+ );
594
+ box-shadow: var(
595
+ --_ctm-mob-dn-gt-cd-cd-sd-se-sw-ae,
596
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-sw-ae, var(--_ctm-dn-gt-cd-cd-sd-se-sw-ae))
597
+ )
598
+ var(
599
+ --_ctm-mob-dn-gt-cd-cd-sd-se-sw-br,
600
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-sw-br, var(--_ctm-dn-gt-cd-cd-sd-se-sw-br))
601
+ )
602
+ var(
603
+ --_ctm-mob-dn-gt-cd-cd-sd-se-sw-sd,
604
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-sw-sd, var(--_ctm-dn-gt-cd-cd-sd-se-sw-sd))
605
+ )
606
+ var(
607
+ --_ctm-mob-dn-gt-cd-cd-sd-se-sw-cr,
608
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-sw-cr, var(--_ctm-dn-gt-cd-cd-sd-se-sw-cr))
609
+ );
610
+ padding: var(
611
+ --_ctm-mob-dn-gt-cd-cd-sd-se-pg,
612
+ var(--_ctm-tab-dn-gt-cd-cd-sd-se-pg, var(--_ctm-dn-gt-cd-cd-sd-se-pg))
613
+ );
614
+ // background-color: #f5f5f5;
615
+ // border: 1px solid #3e4784;
616
+ // color: #000080;
617
+ }
618
+ }
619
+ }
620
+ .custom_amount_container {
621
+ display: flex;
622
+ flex-direction: column;
623
+ gap: 8px;
624
+ .custom_amount_label {
625
+ font-family: var(
626
+ --_ctm-mob-dn-gt-cd-ls-ft-fy,
627
+ var(--_ctm-tab-dn-gt-cd-ls-ft-fy, var(--_ctm-dn-gt-cd-ls-ft-fy))
628
+ );
629
+ color: var(
630
+ --_ctm-mob-dn-gt-cd-ls-cr,
631
+ var(--_ctm-tab-dn-gt-cd-ls-cr, var(--_ctm-dn-gt-cd-ls-cr))
632
+ );
633
+ font-weight: var(
634
+ --_ctm-mob-dn-gt-cd-ls-ft-wt,
635
+ var(--_ctm-tab-dn-gt-cd-ls-ft-wt, var(--_ctm-dn-gt-cd-ls-ft-wt))
636
+ );
637
+ font-size: var(
638
+ --_ctm-mob-dn-gt-cd-ls-ft-se,
639
+ var(--_ctm-tab-dn-gt-cd-ls-ft-se, var(--_ctm-dn-gt-cd-ls-ft-se))
640
+ );
641
+ text-decoration: var(
642
+ --_ctm-mob-dn-gt-cd-ls-ue,
643
+ var(--_ctm-tab-dn-gt-cd-ls-ue, var(--_ctm-dn-gt-cd-ls-ue))
644
+ );
645
+ letter-spacing: var(
646
+ --_ctm-mob-dn-gt-cd-ls-lr-sg,
647
+ var(--_ctm-tab-dn-gt-cd-ls-lr-sg, var(--_ctm-dn-gt-cd-ls-lr-sg))
648
+ );
649
+ line-height: var(
650
+ --_ctm-mob-dn-gt-cd-ls-le-ht,
651
+ var(--_ctm-tab-dn-gt-cd-ls-le-ht, var(--_ctm-dn-gt-cd-ls-le-ht))
652
+ );
653
+ font-style: var(
654
+ --_ctm-mob-dn-gt-cd-ls-ft-se-ic,
655
+ var(--_ctm-tab-dn-gt-cd-ls-ft-se-ic, var(--_ctm-dn-gt-cd-ls-ft-se-ic))
656
+ );
657
+ text-align: var(
658
+ --_ctm-mob-dn-gt-cd-ls-tt-an,
659
+ var(--_ctm-tab-dn-gt-cd-ls-tt-an, var(--_ctm-dn-gt-cd-ls-tt-an))
660
+ );
661
+ padding: var(
662
+ --_ctm-mob-dn-gt-cd-ls-pg,
663
+ var(--_ctm-tab-dn-gt-cd-ls-pg, var(--_ctm-dn-gt-cd-ls-pg))
664
+ );
665
+ }
666
+ .custom_amount_input {
667
+ height: 40px;
668
+ display: flex;
669
+ position: relative;
670
+ // gap: 6px;
671
+ align-items: center;
672
+ // border-radius: 4px;
673
+ // background: #fff;
674
+ // border: 1px solid #d0d5dd;
675
+ // padding: 8px 12px;
676
+ background-color: var(
677
+ --_ctm-mob-dn-gt-cd-is-bd-cr,
678
+ var(--_ctm-tab-dn-gt-cd-is-bd-cr, var(--_ctm-dn-gt-cd-is-bd-cr))
679
+ );
680
+
681
+ border-color: var(
682
+ --_ctm-mob-dn-gt-cd-is-br-cr,
683
+ var(--_ctm-tab-dn-gt-cd-is-br-cr, var(--_ctm-dn-gt-cd-is-br-cr))
684
+ );
685
+ border-radius: var(
686
+ --_ctm-mob-dn-gt-cd-is-br-rs,
687
+ var(--_ctm-tab-dn-gt-cd-is-br-rs, var(--_ctm-dn-gt-cd-is-br-rs))
688
+ );
689
+ border-style: var(
690
+ --_ctm-mob-dn-gt-cd-is-br-se,
691
+ var(--_ctm-tab-dn-gt-cd-is-br-se, var(--_ctm-dn-gt-cd-is-br-se))
692
+ );
693
+ border-width: var(
694
+ --_ctm-mob-dn-gt-cd-is-br-wh,
695
+ var(--_ctm-tab-dn-gt-cd-is-br-wh, var(--_ctm-dn-gt-cd-is-br-wh))
696
+ );
697
+ padding: var(
698
+ --_ctm-mob-dn-gt-cd-is-pg,
699
+ var(--_ctm-tab-dn-gt-cd-is-pg, var(--_ctm-dn-gt-cd-is-pg))
700
+ );
701
+ // width: 220px;
702
+ transition:
703
+ background-color 0.2s,
704
+ color 0.2s,
705
+ border-color 0.2s,
706
+ box-shadow 0.2s;
707
+ .svg_icon {
708
+ color: var(--_gray-700);
709
+ font-weight: 500;
710
+ font-size: 14px;
711
+ line-height: 24px;
712
+ white-space: nowrap;
713
+ }
714
+ input {
715
+ color: var(--_gray-700);
716
+ margin-top: 2px;
717
+ &::placeholder {
718
+ font-family: var(
719
+ --_ctm-mob-dn-gt-cd-is-ft-fy,
720
+ var(--_ctm-tab-dn-gt-cd-is-ft-fy, var(--_ctm-dn-gt-cd-is-ft-fy))
721
+ );
722
+ color: var(
723
+ --_ctm-mob-dn-gt-cd-is-cr,
724
+ var(--_ctm-tab-dn-gt-cd-is-cr, var(--_ctm-dn-gt-cd-is-cr))
725
+ );
726
+ font-weight: var(
727
+ --_ctm-mob-dn-gt-cd-is-ft-wt,
728
+ var(--_ctm-tab-dn-gt-cd-is-ft-wt, var(--_ctm-dn-gt-cd-is-ft-wt))
729
+ );
730
+ font-size: var(
731
+ --_ctm-mob-dn-gt-cd-is-ft-se,
732
+ var(--_ctm-tab-dn-gt-cd-is-ft-se, var(--_ctm-dn-gt-cd-is-ft-se))
733
+ );
734
+ text-decoration: var(
735
+ --_ctm-mob-dn-gt-cd-is-ue,
736
+ var(--_ctm-tab-dn-gt-cd-is-ue, var(--_ctm-dn-gt-cd-is-ue))
737
+ );
738
+ letter-spacing: var(
739
+ --_ctm-mob-dn-gt-cd-is-lr-sg,
740
+ var(--_ctm-tab-dn-gt-cd-is-lr-sg, var(--_ctm-dn-gt-cd-is-lr-sg))
741
+ );
742
+ line-height: var(
743
+ --_ctm-mob-dn-gt-cd-is-le-ht,
744
+ var(--_ctm-tab-dn-gt-cd-is-le-ht, var(--_ctm-dn-gt-cd-is-le-ht))
745
+ );
746
+ font-style: var(
747
+ --_ctm-mob-dn-gt-cd-is-ft-se-ic,
748
+ var(--_ctm-tab-dn-gt-cd-is-ft-se-ic, var(--_ctm-dn-gt-cd-is-ft-se-ic))
749
+ );
750
+ text-align: var(
751
+ --_ctm-mob-dn-gt-cd-is-tt-an,
752
+ var(--_ctm-tab-dn-gt-cd-is-tt-an, var(--_ctm-dn-gt-cd-is-tt-an))
753
+ );
754
+ // color: var(--_gray-500);
755
+ // font-weight: 500;
756
+ // font-size: 14px;
757
+ // line-height: 24px;
758
+ }
759
+ }
760
+ &:focus-within {
761
+ outline: 0 none;
762
+ outline-offset: 0;
763
+ border-radius: 4px;
764
+ box-shadow:
765
+ 0px 1px 2px rgba(16, 24, 40, 0.05),
766
+ 0px 0px 0px 2px var(--_primary-100);
767
+ border: 1px solid var(--_primary-300);
768
+ }
769
+ }
770
+ }
771
+ .delivery_details_container {
772
+ display: flex;
773
+ flex-direction: column;
774
+ gap: var(
775
+ --_ctm-mob-dn-gt-cd-cd-wr-im-gp,
776
+ var(--_ctm-tab-dn-gt-cd-cd-wr-im-gp, var(--_ctm-dn-gt-cd-cd-wr-im-gp))
777
+ );
778
+ .delivery_details_title {
779
+ display: inline-block;
780
+ // margin-top: 8px;
781
+ // margin-bottom: 4px;
782
+ // font-size: 16px;
783
+ // color: #000000;
784
+ // font-weight: 500;
785
+ // line-height: 150%;
786
+ font-family: var(
787
+ --_ctm-mob-dn-gt-cd-ts-ft-fy,
788
+ var(--_ctm-tab-dn-gt-cd-ts-ft-fy, var(--_ctm-dn-gt-cd-ts-ft-fy))
789
+ );
790
+ color: var(
791
+ --_ctm-mob-dn-gt-cd-ts-cr,
792
+ var(--_ctm-tab-dn-gt-cd-ts-cr, var(--_ctm-dn-gt-cd-ts-cr))
793
+ );
794
+ font-weight: var(
795
+ --_ctm-mob-dn-gt-cd-ts-ft-wt,
796
+ var(--_ctm-tab-dn-gt-cd-ts-ft-wt, var(--_ctm-dn-gt-cd-ts-ft-wt))
797
+ );
798
+ font-size: var(
799
+ --_ctm-mob-dn-gt-cd-ts-ft-se,
800
+ var(--_ctm-tab-dn-gt-cd-ts-ft-se, var(--_ctm-dn-gt-cd-ts-ft-se))
801
+ );
802
+ text-decoration: var(
803
+ --_ctm-mob-dn-gt-cd-ts-ue,
804
+ var(--_ctm-tab-dn-gt-cd-ts-ue, var(--_ctm-dn-gt-cd-ts-ue))
805
+ );
806
+ letter-spacing: var(
807
+ --_ctm-mob-dn-gt-cd-ts-lr-sg,
808
+ var(--_ctm-tab-dn-gt-cd-ts-lr-sg, var(--_ctm-dn-gt-cd-ts-lr-sg))
809
+ );
810
+ line-height: var(
811
+ --_ctm-mob-dn-gt-cd-ts-le-ht,
812
+ var(--_ctm-tab-dn-gt-cd-ts-le-ht, var(--_ctm-dn-gt-cd-ts-le-ht))
813
+ );
814
+ font-style: var(
815
+ --_ctm-mob-dn-gt-cd-ts-ft-se-ic,
816
+ var(--_ctm-tab-dn-gt-cd-ts-ft-se-ic, var(--_ctm-dn-gt-cd-ts-ft-se-ic))
817
+ );
818
+ text-align: var(
819
+ --_ctm-mob-dn-gt-cd-ts-tt-an,
820
+ var(--_ctm-tab-dn-gt-cd-ts-tt-an, var(--_ctm-dn-gt-cd-ts-tt-an))
821
+ );
822
+ }
823
+ .horizontal_line {
824
+ // border: 1px solid #d0d5dd;
825
+ // display: block;
826
+ // width: 100%;
827
+ // border-style: var(--_ctm-dn-gt-cd-dr-dr-se);
828
+ // border-color: var(--_ctm-dn-gt-cd-dr-dr-cr);
829
+ // border-width: var(--_ctm-dn-gt-cd-dr-dr-wh);
830
+ border-top: var(--_ctm-dn-gt-cd-dr-dr-wh) var(--_ctm-dn-gt-cd-dr-dr-se)
831
+ var(--_ctm-dn-gt-cd-dr-dr-cr);
832
+ }
833
+ .input_container {
834
+ display: flex;
835
+ flex-direction: column;
836
+ gap: 8px;
837
+ // margin-bottom: 12px;
838
+
839
+ &:last-child {
840
+ margin-bottom: 0;
841
+ }
842
+ label {
843
+ display: block;
844
+ font-family: var(
845
+ --_ctm-mob-dn-gt-cd-ls-ft-fy,
846
+ var(--_ctm-tab-dn-gt-cd-ls-ft-fy, var(--_ctm-dn-gt-cd-ls-ft-fy))
847
+ );
848
+ color: var(
849
+ --_ctm-mob-dn-gt-cd-ls-cr,
850
+ var(--_ctm-tab-dn-gt-cd-ls-cr, var(--_ctm-dn-gt-cd-ls-cr))
851
+ );
852
+ font-weight: var(
853
+ --_ctm-mob-dn-gt-cd-ls-ft-wt,
854
+ var(--_ctm-tab-dn-gt-cd-ls-ft-wt, var(--_ctm-dn-gt-cd-ls-ft-wt))
855
+ );
856
+ font-size: var(
857
+ --_ctm-mob-dn-gt-cd-ls-ft-se,
858
+ var(--_ctm-tab-dn-gt-cd-ls-ft-se, var(--_ctm-dn-gt-cd-ls-ft-se))
859
+ );
860
+ text-decoration: var(
861
+ --_ctm-mob-dn-gt-cd-ls-ue,
862
+ var(--_ctm-tab-dn-gt-cd-ls-ue, var(--_ctm-dn-gt-cd-ls-ue))
863
+ );
864
+ letter-spacing: var(
865
+ --_ctm-mob-dn-gt-cd-ls-lr-sg,
866
+ var(--_ctm-tab-dn-gt-cd-ls-lr-sg, var(--_ctm-dn-gt-cd-ls-lr-sg))
867
+ );
868
+ line-height: var(
869
+ --_ctm-mob-dn-gt-cd-ls-le-ht,
870
+ var(--_ctm-tab-dn-gt-cd-ls-le-ht, var(--_ctm-dn-gt-cd-ls-le-ht))
871
+ );
872
+ font-style: var(
873
+ --_ctm-mob-dn-gt-cd-ls-ft-se-ic,
874
+ var(--_ctm-tab-dn-gt-cd-ls-ft-se-ic, var(--_ctm-dn-gt-cd-ls-ft-se-ic))
875
+ );
876
+ text-align: var(
877
+ --_ctm-mob-dn-gt-cd-ls-tt-an,
878
+ var(--_ctm-tab-dn-gt-cd-ls-tt-an, var(--_ctm-dn-gt-cd-ls-tt-an))
879
+ );
880
+ padding: var(
881
+ --_ctm-mob-dn-gt-cd-ls-pg,
882
+ var(--_ctm-tab-dn-gt-cd-ls-pg, var(--_ctm-dn-gt-cd-ls-pg))
883
+ );
884
+ // color: var(--_gray-700);
885
+ // font-weight: 400;
886
+ // font-size: 14px;
887
+ // line-height: 20px;
888
+ }
889
+ .message_text {
890
+ resize: none;
891
+ // background-color: var(--_base-white);
892
+ // padding: 5px 12px;
893
+ // border: 1px solid var(--_gray-300);
894
+ // border-radius: 4px;
895
+ background-color: var(
896
+ --_ctm-mob-dn-gt-cd-is-bd-cr,
897
+ var(--_ctm-tab-dn-gt-cd-is-bd-cr, var(--_ctm-dn-gt-cd-is-bd-cr))
898
+ );
899
+
900
+ border-color: var(
901
+ --_ctm-mob-dn-gt-cd-is-br-cr,
902
+ var(--_ctm-tab-dn-gt-cd-is-br-cr, var(--_ctm-dn-gt-cd-is-br-cr))
903
+ );
904
+ border-radius: var(
905
+ --_ctm-mob-dn-gt-cd-is-br-rs,
906
+ var(--_ctm-tab-dn-gt-cd-is-br-rs, var(--_ctm-dn-gt-cd-is-br-rs))
907
+ );
908
+ border-style: var(
909
+ --_ctm-mob-dn-gt-cd-is-br-se,
910
+ var(--_ctm-tab-dn-gt-cd-is-br-se, var(--_ctm-dn-gt-cd-is-br-se))
911
+ );
912
+ border-width: var(
913
+ --_ctm-mob-dn-gt-cd-is-br-wh,
914
+ var(--_ctm-tab-dn-gt-cd-is-br-wh, var(--_ctm-dn-gt-cd-is-br-wh))
915
+ );
916
+ padding: var(
917
+ --_ctm-mob-dn-gt-cd-is-pg,
918
+ var(--_ctm-tab-dn-gt-cd-is-pg, var(--_ctm-dn-gt-cd-is-pg))
919
+ );
920
+ // margin-bottom: 8px;
921
+ transition:
922
+ background-color 0.2s,
923
+ color 0.2s,
924
+ border-color 0.2s,
925
+ box-shadow 0.2s;
926
+ height: 90px;
927
+ &::placeholder {
928
+ // color: var(--_gray-500);
929
+ // font-weight: 500;
930
+ // font-size: 14px;
931
+ // line-height: 24px;
932
+ font-family: var(
933
+ --_ctm-mob-dn-gt-cd-is-ft-fy,
934
+ var(--_ctm-tab-dn-gt-cd-is-ft-fy, var(--_ctm-dn-gt-cd-is-ft-fy))
935
+ );
936
+ color: var(
937
+ --_ctm-mob-dn-gt-cd-is-cr,
938
+ var(--_ctm-tab-dn-gt-cd-is-cr, var(--_ctm-dn-gt-cd-is-cr))
939
+ );
940
+ font-weight: var(
941
+ --_ctm-mob-dn-gt-cd-is-ft-wt,
942
+ var(--_ctm-tab-dn-gt-cd-is-ft-wt, var(--_ctm-dn-gt-cd-is-ft-wt))
943
+ );
944
+ font-size: var(
945
+ --_ctm-mob-dn-gt-cd-is-ft-se,
946
+ var(--_ctm-tab-dn-gt-cd-is-ft-se, var(--_ctm-dn-gt-cd-is-ft-se))
947
+ );
948
+ text-decoration: var(
949
+ --_ctm-mob-dn-gt-cd-is-ue,
950
+ var(--_ctm-tab-dn-gt-cd-is-ue, var(--_ctm-dn-gt-cd-is-ue))
951
+ );
952
+ letter-spacing: var(
953
+ --_ctm-mob-dn-gt-cd-is-lr-sg,
954
+ var(--_ctm-tab-dn-gt-cd-is-lr-sg, var(--_ctm-dn-gt-cd-is-lr-sg))
955
+ );
956
+ line-height: var(
957
+ --_ctm-mob-dn-gt-cd-is-le-ht,
958
+ var(--_ctm-tab-dn-gt-cd-is-le-ht, var(--_ctm-dn-gt-cd-is-le-ht))
959
+ );
960
+ font-style: var(
961
+ --_ctm-mob-dn-gt-cd-is-ft-se-ic,
962
+ var(--_ctm-tab-dn-gt-cd-is-ft-se-ic, var(--_ctm-dn-gt-cd-is-ft-se-ic))
963
+ );
964
+ text-align: var(
965
+ --_ctm-mob-dn-gt-cd-is-tt-an,
966
+ var(--_ctm-tab-dn-gt-cd-is-tt-an, var(--_ctm-dn-gt-cd-is-tt-an))
967
+ );
968
+ }
969
+ &:focus {
970
+ outline: 0 none;
971
+ outline-offset: 0;
972
+ border-radius: 4px;
973
+ box-shadow:
974
+ 0px 1px 2px rgba(16, 24, 40, 0.05),
975
+ 0px 0px 0px 2px var(--_primary-100);
976
+ border: 1px solid var(--_primary-300);
977
+ }
978
+ }
979
+ input {
980
+ // background-color: var(--_base-white);
981
+ // padding: 8px 12px;
982
+ // border: 1px solid var(--_gray-300);
983
+ // border-radius: 4px;
984
+ height: 40px;
985
+
986
+ background-color: var(
987
+ --_ctm-mob-dn-gt-cd-is-bd-cr,
988
+ var(--_ctm-tab-dn-gt-cd-is-bd-cr, var(--_ctm-dn-gt-cd-is-bd-cr))
989
+ );
990
+
991
+ border-color: var(
992
+ --_ctm-mob-dn-gt-cd-is-br-cr,
993
+ var(--_ctm-tab-dn-gt-cd-is-br-cr, var(--_ctm-dn-gt-cd-is-br-cr))
994
+ );
995
+ border-radius: var(
996
+ --_ctm-mob-dn-gt-cd-is-br-rs,
997
+ var(--_ctm-tab-dn-gt-cd-is-br-rs, var(--_ctm-dn-gt-cd-is-br-rs))
998
+ );
999
+ border-style: var(
1000
+ --_ctm-mob-dn-gt-cd-is-br-se,
1001
+ var(--_ctm-tab-dn-gt-cd-is-br-se, var(--_ctm-dn-gt-cd-is-br-se))
1002
+ );
1003
+ border-width: var(
1004
+ --_ctm-mob-dn-gt-cd-is-br-wh,
1005
+ var(--_ctm-tab-dn-gt-cd-is-br-wh, var(--_ctm-dn-gt-cd-is-br-wh))
1006
+ );
1007
+ padding: var(
1008
+ --_ctm-mob-dn-gt-cd-is-pg,
1009
+ var(--_ctm-tab-dn-gt-cd-is-pg, var(--_ctm-dn-gt-cd-is-pg))
1010
+ );
1011
+
1012
+ transition:
1013
+ background-color 0.2s,
1014
+ color 0.2s,
1015
+ border-color 0.2s,
1016
+ box-shadow 0.2s;
1017
+ &::placeholder {
1018
+ // color: var(--_gray-500);
1019
+ // font-weight: 500;
1020
+ // font-size: 14px;
1021
+ // line-height: 24px;
1022
+ font-family: var(
1023
+ --_ctm-mob-dn-gt-cd-is-ft-fy,
1024
+ var(--_ctm-tab-dn-gt-cd-is-ft-fy, var(--_ctm-dn-gt-cd-is-ft-fy))
1025
+ );
1026
+ color: var(
1027
+ --_ctm-mob-dn-gt-cd-is-cr,
1028
+ var(--_ctm-tab-dn-gt-cd-is-cr, var(--_ctm-dn-gt-cd-is-cr))
1029
+ );
1030
+ font-weight: var(
1031
+ --_ctm-mob-dn-gt-cd-is-ft-wt,
1032
+ var(--_ctm-tab-dn-gt-cd-is-ft-wt, var(--_ctm-dn-gt-cd-is-ft-wt))
1033
+ );
1034
+ font-size: var(
1035
+ --_ctm-mob-dn-gt-cd-is-ft-se,
1036
+ var(--_ctm-tab-dn-gt-cd-is-ft-se, var(--_ctm-dn-gt-cd-is-ft-se))
1037
+ );
1038
+ text-decoration: var(
1039
+ --_ctm-mob-dn-gt-cd-is-ue,
1040
+ var(--_ctm-tab-dn-gt-cd-is-ue, var(--_ctm-dn-gt-cd-is-ue))
1041
+ );
1042
+ letter-spacing: var(
1043
+ --_ctm-mob-dn-gt-cd-is-lr-sg,
1044
+ var(--_ctm-tab-dn-gt-cd-is-lr-sg, var(--_ctm-dn-gt-cd-is-lr-sg))
1045
+ );
1046
+ line-height: var(
1047
+ --_ctm-mob-dn-gt-cd-is-le-ht,
1048
+ var(--_ctm-tab-dn-gt-cd-is-le-ht, var(--_ctm-dn-gt-cd-is-le-ht))
1049
+ );
1050
+ font-style: var(
1051
+ --_ctm-mob-dn-gt-cd-is-ft-se-ic,
1052
+ var(--_ctm-tab-dn-gt-cd-is-ft-se-ic, var(--_ctm-dn-gt-cd-is-ft-se-ic))
1053
+ );
1054
+ text-align: var(
1055
+ --_ctm-mob-dn-gt-cd-is-tt-an,
1056
+ var(--_ctm-tab-dn-gt-cd-is-tt-an, var(--_ctm-dn-gt-cd-is-tt-an))
1057
+ );
1058
+ }
1059
+ &:focus {
1060
+ outline: 0 none;
1061
+ outline-offset: 0;
1062
+ border-radius: 4px;
1063
+ box-shadow:
1064
+ 0px 1px 2px rgba(16, 24, 40, 0.05),
1065
+ 0px 0px 0px 2px var(--_primary-100);
1066
+ border: 1px solid var(--_primary-300);
1067
+ }
1068
+ }
1069
+ .error_text {
1070
+ font-size: 12px;
1071
+ color: var(--_error-500);
1072
+ }
1073
+ }
1074
+ }
1075
+ }
1076
+ }
1077
+ .product-actual-price-container {
1078
+ .product-actual-discount {
1079
+ .discount-percentage {
1080
+ background-color: var(
1081
+ --_ctm-mob-dn-dt-bd-cr,
1082
+ var(--_ctm-tab-dn-dt-bd-cr, var(--_ctm-dn-dt-bd-cr))
1083
+ );
1084
+ color: var(--_ctm-mob-dn-dt-cr, var(--_ctm-tab-dn-dt-cr, var(--_ctm-dn-dt-cr)));
1085
+ font-family: var(
1086
+ --_ctm-mob-dn-dt-ft-fy,
1087
+ var(--_ctm-tab-dn-dt-ft-fy, var(--_ctm-dn-dt-ft-fy))
1088
+ );
1089
+ font-size: var(
1090
+ --_ctm-mob-dn-dt-ft-se,
1091
+ var(--_ctm-tab-dn-dt-ft-se, var(--_ctm-dn-dt-ft-se))
1092
+ );
1093
+ font-weight: var(
1094
+ --_ctm-mob-dn-dt-ft-wt,
1095
+ var(--_ctm-tab-dn-dt-ft-wt, var(--_ctm-dn-dt-ft-wt))
1096
+ );
1097
+ font-style: var(
1098
+ --_ctm-mob-dn-dt-ft-se-ic,
1099
+ var(--_ctm-tab-dn-dt-ft-se-ic, var(--_ctm-dn-dt-ft-se-ic))
1100
+ );
1101
+ text-align: var(
1102
+ --_ctm-mob-dn-dt-tt-an,
1103
+ var(--_ctm-tab-dn-dt-tt-an, var(--_ctm-dn-dt-tt-an))
1104
+ );
1105
+ letter-spacing: var(
1106
+ --_ctm-mob-dn-dt-lr-sg,
1107
+ var(--_ctm-tab-dn-dt-lr-sg, var(--_ctm-dn-dt-lr-sg))
1108
+ );
1109
+ line-height: var(
1110
+ --_ctm-mob-dn-dt-le-ht,
1111
+ var(--_ctm-tab-dn-dt-le-ht, var(--_ctm-dn-dt-le-ht))
1112
+ );
1113
+ text-decoration: var(--_ctm-mob-dn-dt-ue, var(--_ctm-tab-dn-dt-ue, var(--_ctm-dn-dt-ue)));
1114
+
1115
+ border-color: var(
1116
+ --_show-border,
1117
+ var(--_ctm-mob-dn-dt-br-cr, var(--_ctm-tab-dn-dt-br-cr, var(--_ctm-dn-dt-br-cr)))
1118
+ );
1119
+ border-style: var(
1120
+ --_show-border,
1121
+ var(--_ctm-mob-dn-dt-br-se, var(--_ctm-tab-dn-dt-br-se, var(--_ctm-dn-dt-br-se)))
1122
+ );
1123
+ border-width: var(
1124
+ --_show-border,
1125
+ var(--_ctm-mob-dn-dt-br-wh, var(--_ctm-tab-dn-dt-br-wh, var(--_ctm-dn-dt-br-wh)))
1126
+ );
1127
+ border-radius: var(
1128
+ --_ctm-mob-dn-dt-br-rs,
1129
+ var(--_ctm-tab-dn-dt-br-rs, var(--_ctm-dn-dt-br-rs))
1130
+ );
1131
+
1132
+ box-shadow: var(
1133
+ --_show-shadow,
1134
+ var(--_ctm-mob-dn-dt-sw-ae, var(--_ctm-tab-dn-dt-sw-ae, var(--_ctm-dn-dt-sw-ae)))
1135
+ var(--_ctm-mob-dn-dt-sw-br, var(--_ctm-tab-dn-dt-sw-br, var(--_ctm-dn-dt-sw-br)))
1136
+ var(--_ctm-mob-dn-dt-sw-sd, var(--_ctm-tab-dn-dt-sw-sd, var(--_ctm-dn-dt-sw-sd)))
1137
+ var(--_ctm-mob-dn-dt-sw-cr, var(--_ctm-tab-dn-dt-sw-cr, var(--_ctm-dn-dt-sw-cr)))
1138
+ );
1139
+ }
1140
+
1141
+ .discount-value-percentage {
1142
+ background-color: var(
1143
+ --_ctm-mob-dn-dt-ve-bd-cr,
1144
+ var(--_ctm-tab-dn-dt-ve-bd-cr, var(--_ctm-dn-dt-ve-bd-cr))
1145
+ );
1146
+ color: var(--_ctm-mob-dn-dt-ve-cr, var(--_ctm-tab-dn-dt-ve-cr, var(--_ctm-dn-dt-ve-cr)));
1147
+ font-family: var(
1148
+ --_ctm-mob-dn-dt-ve-ft-fy,
1149
+ var(--_ctm-tab-dn-dt-ve-ft-fy, var(--_ctm-dn-dt-ve-ft-fy))
1150
+ );
1151
+ font-size: var(
1152
+ --_ctm-mob-dn-dt-ve-ft-se,
1153
+ var(--_ctm-tab-dn-dt-ve-ft-se, var(--_ctm-dn-dt-ve-ft-se))
1154
+ );
1155
+ font-weight: var(
1156
+ --_ctm-mob-dn-dt-ve-ft-wt,
1157
+ var(--_ctm-tab-dn-dt-ve-ft-wt, var(--_ctm-dn-dt-ve-ft-wt))
1158
+ );
1159
+ font-style: var(
1160
+ --_ctm-mob-dn-dt-ve-ft-se-ic,
1161
+ var(--_ctm-tab-dn-dt-ve-ft-se-ic, var(--_ctm-dn-dt-ve-ft-se-ic))
1162
+ );
1163
+ text-align: var(
1164
+ --_ctm-mob-dn-dt-ve-tt-an,
1165
+ var(--_ctm-tab-dn-dt-ve-tt-an, var(--_ctm-dn-dt-ve-tt-an))
1166
+ );
1167
+ letter-spacing: var(
1168
+ --_ctm-mob-dn-dt-ve-lr-sg,
1169
+ var(--_ctm-tab-dn-dt-ve-lr-sg, var(--_ctm-dn-dt-ve-lr-sg))
1170
+ );
1171
+ line-height: var(
1172
+ --_ctm-mob-dn-dt-ve-le-ht,
1173
+ var(--_ctm-tab-dn-dt-ve-le-ht, var(--_ctm-dn-dt-ve-le-ht))
1174
+ );
1175
+ text-decoration: var(
1176
+ --_ctm-mob-dn-dt-ve-ue,
1177
+ var(--_ctm-tab-dn-dt-ve-ue, var(--_ctm-dn-dt-ve-ue))
1178
+ );
1179
+
1180
+ border-color: var(
1181
+ --_show-border,
1182
+ var(
1183
+ --_ctm-mob-dn-dt-ve-br-cr,
1184
+ var(--_ctm-tab-dn-dt-ve-br-cr, var(--_ctm-dn-dt-ve-br-cr))
1185
+ )
1186
+ );
1187
+ border-style: var(
1188
+ --_show-border,
1189
+ var(
1190
+ --_ctm-mob-dn-dt-ve-br-se,
1191
+ var(--_ctm-tab-dn-dt-ve-br-se, var(--_ctm-dn-dt-ve-br-se))
1192
+ )
1193
+ );
1194
+ border-width: var(
1195
+ --_show-border,
1196
+ var(
1197
+ --_ctm-mob-dn-dt-ve-br-wh,
1198
+ var(--_ctm-tab-dn-dt-ve-br-wh, var(--_ctm-dn-dt-ve-br-wh))
1199
+ )
1200
+ );
1201
+ border-radius: var(
1202
+ --_ctm-mob-dn-dt-ve-br-rs,
1203
+ var(--_ctm-tab-dn-dt-ve-br-rs, var(--_ctm-dn-dt-ve-br-rs))
1204
+ );
1205
+
1206
+ box-shadow: var(
1207
+ --_show-shadow,
1208
+ var(
1209
+ --_ctm-mob-dn-dt-ve-sw-ae,
1210
+ var(--_ctm-tab-dn-dt-ve-sw-ae, var(--_ctm-dn-dt-ve-sw-ae))
1211
+ )
1212
+ var(
1213
+ --_ctm-mob-dn-dt-ve-sw-br,
1214
+ var(--_ctm-tab-dn-dt-ve-sw-br, var(--_ctm-dn-dt-ve-sw-br))
1215
+ )
1216
+ var(
1217
+ --_ctm-mob-dn-dt-ve-sw-sd,
1218
+ var(--_ctm-tab-dn-dt-ve-sw-sd, var(--_ctm-dn-dt-ve-sw-sd))
1219
+ )
1220
+ var(
1221
+ --_ctm-mob-dn-dt-ve-sw-cr,
1222
+ var(--_ctm-tab-dn-dt-ve-sw-cr, var(--_ctm-dn-dt-ve-sw-cr))
1223
+ )
1224
+ );
1225
+ }
1226
+ }
1227
+ .product-actual-price {
1228
+ .actual-price-span {
1229
+ background-color: var(
1230
+ --_ctm-mob-dn-al-pe-bd-cr,
1231
+ var(--_ctm-tab-dn-al-pe-bd-cr, var(--_ctm-dn-al-pe-bd-cr))
1232
+ );
1233
+ color: var(--_ctm-mob-dn-al-pe-cr, var(--_ctm-tab-dn-al-pe-cr, var(--_ctm-dn-al-pe-cr)));
1234
+ font-family: var(
1235
+ --_ctm-mob-dn-al-pe-ft-fy,
1236
+ var(--_ctm-tab-dn-al-pe-ft-fy, var(--_ctm-dn-al-pe-ft-fy))
1237
+ );
1238
+ font-size: var(
1239
+ --_ctm-mob-dn-al-pe-ft-se,
1240
+ var(--_ctm-tab-dn-al-pe-ft-se, var(--_ctm-dn-al-pe-ft-se))
1241
+ );
1242
+ font-weight: var(
1243
+ --_ctm-mob-dn-al-pe-ft-wt,
1244
+ var(--_ctm-tab-dn-al-pe-ft-wt, var(--_ctm-dn-al-pe-ft-wt))
1245
+ );
1246
+ font-style: var(
1247
+ --_ctm-mob-dn-al-pe-ft-se-ic,
1248
+ var(--_ctm-tab-dn-al-pe-ft-se-ic, var(--_ctm-dn-al-pe-ft-se-ic))
1249
+ );
1250
+ text-align: var(
1251
+ --_ctm-mob-dn-al-pe-tt-an,
1252
+ var(--_ctm-tab-dn-al-pe-tt-an, var(--_ctm-dn-al-pe-tt-an))
1253
+ );
1254
+ letter-spacing: var(
1255
+ --_ctm-mob-dn-al-pe-lr-sg,
1256
+ var(--_ctm-tab-dn-al-pe-lr-sg, var(--_ctm-dn-al-pe-lr-sg))
1257
+ );
1258
+ line-height: var(
1259
+ --_ctm-mob-dn-al-pe-le-ht,
1260
+ var(--_ctm-tab-dn-al-pe-le-ht, var(--_ctm-dn-al-pe-le-ht))
1261
+ );
1262
+ text-decoration: var(
1263
+ --_ctm-mob-dn-al-pe-ue,
1264
+ var(--_ctm-tab-dn-al-pe-ue, var(--_ctm-dn-al-pe-ue))
1265
+ );
1266
+
1267
+ border-color: var(
1268
+ --_show-border,
1269
+ var(
1270
+ --_ctm-mob-dn-al-pe-br-cr,
1271
+ var(--_ctm-tab-dn-al-pe-br-cr, var(--_ctm-dn-al-pe-br-cr))
1272
+ )
1273
+ );
1274
+ border-style: var(
1275
+ --_show-border,
1276
+ var(
1277
+ --_ctm-mob-dn-al-pe-br-se,
1278
+ var(--_ctm-tab-dn-al-pe-br-se, var(--_ctm-dn-al-pe-br-se))
1279
+ )
1280
+ );
1281
+ border-width: var(
1282
+ --_show-border,
1283
+ var(
1284
+ --_ctm-mob-dn-al-pe-br-wh,
1285
+ var(--_ctm-tab-dn-al-pe-br-wh, var(--_ctm-dn-al-pe-br-wh))
1286
+ )
1287
+ );
1288
+ border-radius: var(
1289
+ --_ctm-mob-dn-al-pe-br-rs,
1290
+ var(--_ctm-tab-dn-al-pe-br-rs, var(--_ctm-dn-al-pe-br-rs))
1291
+ );
1292
+
1293
+ box-shadow: var(
1294
+ --_show-shadow,
1295
+ var(
1296
+ --_ctm-mob-dn-al-pe-sw-ae,
1297
+ var(--_ctm-tab-dn-al-pe-sw-ae, var(--_ctm-dn-al-pe-sw-ae))
1298
+ )
1299
+ var(
1300
+ --_ctm-mob-dn-al-pe-sw-br,
1301
+ var(--_ctm-tab-dn-al-pe-sw-br, var(--_ctm-dn-al-pe-sw-br))
1302
+ )
1303
+ var(
1304
+ --_ctm-mob-dn-al-pe-sw-sd,
1305
+ var(--_ctm-tab-dn-al-pe-sw-sd, var(--_ctm-dn-al-pe-sw-sd))
1306
+ )
1307
+ var(
1308
+ --_ctm-mob-dn-al-pe-sw-cr,
1309
+ var(--_ctm-tab-dn-al-pe-sw-cr, var(--_ctm-dn-al-pe-sw-cr))
1310
+ )
1311
+ );
1312
+ }
1313
+
1314
+ .code-span {
1315
+ background-color: var(
1316
+ --_ctm-mob-dn-cy-ce-se-bd-cr,
1317
+ var(--_ctm-tab-dn-cy-ce-se-bd-cr, var(--_ctm-dn-cy-ce-se-bd-cr))
1318
+ );
1319
+ color: var(
1320
+ --_ctm-mob-dn-cy-ce-se-cr,
1321
+ var(--_ctm-tab-dn-cy-ce-se-cr, var(--_ctm-dn-cy-ce-se-cr))
1322
+ );
1323
+ font-family: var(
1324
+ --_ctm-mob-dn-cy-ce-se-ft-fy,
1325
+ var(--_ctm-tab-dn-cy-ce-se-ft-fy, var(--_ctm-dn-cy-ce-se-ft-fy))
1326
+ );
1327
+ font-size: var(
1328
+ --_ctm-mob-dn-cy-ce-se-ft-se,
1329
+ var(--_ctm-tab-dn-cy-ce-se-ft-se, var(--_ctm-dn-cy-ce-se-ft-se))
1330
+ );
1331
+ font-weight: var(
1332
+ --_ctm-mob-dn-cy-ce-se-ft-wt,
1333
+ var(--_ctm-tab-dn-cy-ce-se-ft-wt, var(--_ctm-dn-cy-ce-se-ft-wt))
1334
+ );
1335
+ font-style: var(
1336
+ --_ctm-mob-dn-cy-ce-se-ft-se-ic,
1337
+ var(--_ctm-tab-dn-cy-ce-se-ft-se-ic, var(--_ctm-dn-cy-ce-se-ft-se-ic))
1338
+ );
1339
+ text-align: var(
1340
+ --_ctm-mob-dn-cy-ce-se-tt-an,
1341
+ var(--_ctm-tab-dn-cy-ce-se-tt-an, var(--_ctm-dn-cy-ce-se-tt-an))
1342
+ );
1343
+ letter-spacing: var(
1344
+ --_ctm-mob-dn-cy-ce-se-lr-sg,
1345
+ var(--_ctm-tab-dn-cy-ce-se-lr-sg, var(--_ctm-dn-cy-ce-se-lr-sg))
1346
+ );
1347
+ line-height: var(
1348
+ --_ctm-mob-dn-cy-ce-se-le-ht,
1349
+ var(--_ctm-tab-dn-cy-ce-se-le-ht, var(--_ctm-dn-cy-ce-se-le-ht))
1350
+ );
1351
+ text-decoration: var(
1352
+ --_ctm-mob-dn-cy-ce-se-ue,
1353
+ var(--_ctm-tab-dn-cy-ce-se-ue, var(--_ctm-dn-cy-ce-se-ue))
1354
+ );
1355
+
1356
+ border-color: var(
1357
+ --_show-border,
1358
+ var(
1359
+ --_ctm-mob-dn-cy-ce-se-br-cr,
1360
+ var(--_ctm-tab-dn-cy-ce-se-br-cr, var(--_ctm-dn-cy-ce-se-br-cr))
1361
+ )
1362
+ );
1363
+ border-style: var(
1364
+ --_show-border,
1365
+ var(
1366
+ --_ctm-mob-dn-cy-ce-se-br-se,
1367
+ var(--_ctm-tab-dn-cy-ce-se-br-se, var(--_ctm-dn-cy-ce-se-br-se))
1368
+ )
1369
+ );
1370
+ border-width: var(
1371
+ --_show-border,
1372
+ var(
1373
+ --_ctm-mob-dn-cy-ce-se-br-wh,
1374
+ var(--_ctm-tab-dn-cy-ce-se-br-wh, var(--_ctm-dn-cy-ce-se-br-wh))
1375
+ )
1376
+ );
1377
+ border-radius: var(
1378
+ --_ctm-mob-dn-cy-ce-se-br-rs,
1379
+ var(--_ctm-tab-dn-cy-ce-se-br-rs, var(--_ctm-dn-cy-ce-se-br-rs))
1380
+ );
1381
+
1382
+ box-shadow: var(
1383
+ --_show-shadow,
1384
+ var(
1385
+ --_ctm-mob-dn-cy-ce-se-sw-ae,
1386
+ var(--_ctm-tab-dn-cy-ce-se-sw-ae, var(--_ctm-dn-cy-ce-se-sw-ae))
1387
+ )
1388
+ var(
1389
+ --_ctm-mob-dn-cy-ce-se-sw-br,
1390
+ var(--_ctm-tab-dn-cy-ce-se-sw-br, var(--_ctm-dn-cy-ce-se-sw-br))
1391
+ )
1392
+ var(
1393
+ --_ctm-mob-dn-cy-ce-se-sw-sd,
1394
+ var(--_ctm-tab-dn-cy-ce-se-sw-sd, var(--_ctm-dn-cy-ce-se-sw-sd))
1395
+ )
1396
+ var(
1397
+ --_ctm-mob-dn-cy-ce-se-sw-cr,
1398
+ var(--_ctm-tab-dn-cy-ce-se-sw-cr, var(--_ctm-dn-cy-ce-se-sw-cr))
1399
+ )
1400
+ );
1401
+ }
1402
+
1403
+ .uom-span {
1404
+ background-color: var(
1405
+ --_ctm-mob-dn-um-se-bd-cr,
1406
+ var(--_ctm-tab-dn-um-se-bd-cr, var(--_ctm-dn-um-se-bd-cr))
1407
+ );
1408
+ color: var(--_ctm-mob-dn-um-se-cr, var(--_ctm-tab-dn-um-se-cr, var(--_ctm-dn-um-se-cr)));
1409
+ font-family: var(
1410
+ --_ctm-mob-dn-um-se-ft-fy,
1411
+ var(--_ctm-tab-dn-um-se-ft-fy, var(--_ctm-dn-um-se-ft-fy))
1412
+ );
1413
+ font-size: var(
1414
+ --_ctm-mob-dn-um-se-ft-se,
1415
+ var(--_ctm-tab-dn-um-se-ft-se, var(--_ctm-dn-um-se-ft-se))
1416
+ );
1417
+ font-weight: var(
1418
+ --_ctm-mob-dn-um-se-ft-wt,
1419
+ var(--_ctm-tab-dn-um-se-ft-wt, var(--_ctm-dn-um-se-ft-wt))
1420
+ );
1421
+ font-style: var(
1422
+ --_ctm-mob-dn-um-se-ft-se-ic,
1423
+ var(--_ctm-tab-dn-um-se-ft-se-ic, var(--_ctm-dn-um-se-ft-se-ic))
1424
+ );
1425
+ text-align: var(
1426
+ --_ctm-mob-dn-um-se-tt-an,
1427
+ var(--_ctm-tab-dn-um-se-tt-an, var(--_ctm-dn-um-se-tt-an))
1428
+ );
1429
+ letter-spacing: var(
1430
+ --_ctm-mob-dn-um-se-lr-sg,
1431
+ var(--_ctm-tab-dn-um-se-lr-sg, var(--_ctm-dn-um-se-lr-sg))
1432
+ );
1433
+ line-height: var(
1434
+ --_ctm-mob-dn-um-se-le-ht,
1435
+ var(--_ctm-tab-dn-um-se-le-ht, var(--_ctm-dn-um-se-le-ht))
1436
+ );
1437
+ text-decoration: var(
1438
+ --_ctm-mob-dn-um-se-ue,
1439
+ var(--_ctm-tab-dn-um-se-ue, var(--_ctm-dn-um-se-ue))
1440
+ );
1441
+
1442
+ border-color: var(
1443
+ --_show-border,
1444
+ var(
1445
+ --_ctm-mob-dn-um-se-br-cr,
1446
+ var(--_ctm-tab-dn-um-se-br-cr, var(--_ctm-dn-um-se-br-cr))
1447
+ )
1448
+ );
1449
+ border-style: var(
1450
+ --_show-border,
1451
+ var(
1452
+ --_ctm-mob-dn-um-se-br-se,
1453
+ var(--_ctm-tab-dn-um-se-br-se, var(--_ctm-dn-um-se-br-se))
1454
+ )
1455
+ );
1456
+ border-width: var(
1457
+ --_show-border,
1458
+ var(
1459
+ --_ctm-mob-dn-um-se-br-wh,
1460
+ var(--_ctm-tab-dn-um-se-br-wh, var(--_ctm-dn-um-se-br-wh))
1461
+ )
1462
+ );
1463
+ border-radius: var(
1464
+ --_ctm-mob-dn-um-se-br-rs,
1465
+ var(--_ctm-tab-dn-um-se-br-rs, var(--_ctm-dn-um-se-br-rs))
1466
+ );
1467
+
1468
+ box-shadow: var(
1469
+ --_show-shadow,
1470
+ var(
1471
+ --_ctm-mob-dn-um-se-sw-ae,
1472
+ var(--_ctm-tab-dn-um-se-sw-ae, var(--_ctm-dn-um-se-sw-ae))
1473
+ )
1474
+ var(
1475
+ --_ctm-mob-dn-um-se-sw-br,
1476
+ var(--_ctm-tab-dn-um-se-sw-br, var(--_ctm-dn-um-se-sw-br))
1477
+ )
1478
+ var(
1479
+ --_ctm-mob-dn-um-se-sw-sd,
1480
+ var(--_ctm-tab-dn-um-se-sw-sd, var(--_ctm-dn-um-se-sw-sd))
1481
+ )
1482
+ var(
1483
+ --_ctm-mob-dn-um-se-sw-cr,
1484
+ var(--_ctm-tab-dn-um-se-sw-cr, var(--_ctm-dn-um-se-sw-cr))
1485
+ )
1486
+ );
1487
+ }
1488
+ }
1489
+ }
1490
+ .product-savings {
1491
+ .product-savings-wrapper {
1492
+ .savings-percent-span {
1493
+ background-color: var(
1494
+ --_ctm-mob-dn-ss-bd-cr,
1495
+ var(--_ctm-tab-dn-ss-bd-cr, var(--_ctm-dn-ss-bd-cr))
1496
+ );
1497
+ color: var(--_ctm-mob-dn-ss-cr, var(--_ctm-tab-dn-ss-cr, var(--_ctm-dn-ss-cr)));
1498
+ font-family: var(
1499
+ --_ctm-mob-dn-ss-ft-fy,
1500
+ var(--_ctm-tab-dn-ss-ft-fy, var(--_ctm-dn-ss-ft-fy))
1501
+ );
1502
+ font-size: var(
1503
+ --_ctm-mob-dn-ss-ft-se,
1504
+ var(--_ctm-tab-dn-ss-ft-se, var(--_ctm-dn-ss-ft-se))
1505
+ );
1506
+ font-weight: var(
1507
+ --_ctm-mob-dn-ss-ft-wt,
1508
+ var(--_ctm-tab-dn-ss-ft-wt, var(--_ctm-dn-ss-ft-wt))
1509
+ );
1510
+ font-style: var(
1511
+ --_ctm-mob-dn-ss-ft-se-ic,
1512
+ var(--_ctm-tab-dn-ss-ft-se-ic, var(--_ctm-dn-ss-ft-se-ic))
1513
+ );
1514
+ text-align: var(
1515
+ --_ctm-mob-dn-ss-tt-an,
1516
+ var(--_ctm-tab-dn-ss-tt-an, var(--_ctm-dn-ss-tt-an))
1517
+ );
1518
+ letter-spacing: var(
1519
+ --_ctm-mob-dn-ss-lr-sg,
1520
+ var(--_ctm-tab-dn-ss-lr-sg, var(--_ctm-dn-ss-lr-sg))
1521
+ );
1522
+ line-height: var(
1523
+ --_ctm-mob-dn-ss-le-ht,
1524
+ var(--_ctm-tab-dn-ss-le-ht, var(--_ctm-dn-ss-le-ht))
1525
+ );
1526
+ text-decoration: var(--_ctm-mob-dn-ss-ue, var(--_ctm-tab-dn-ss-ue, var(--_ctm-dn-ss-ue)));
1527
+
1528
+ border-color: var(
1529
+ --_show-border,
1530
+ var(--_ctm-mob-dn-ss-br-cr, var(--_ctm-tab-dn-ss-br-cr, var(--_ctm-dn-ss-br-cr)))
1531
+ );
1532
+ border-style: var(
1533
+ --_show-border,
1534
+ var(--_ctm-mob-dn-ss-br-se, var(--_ctm-tab-dn-ss-br-se, var(--_ctm-dn-ss-br-se)))
1535
+ );
1536
+ border-width: var(
1537
+ --_show-border,
1538
+ var(--_ctm-mob-dn-ss-br-wh, var(--_ctm-tab-dn-ss-br-wh, var(--_ctm-dn-ss-br-wh)))
1539
+ );
1540
+ border-radius: var(
1541
+ --_ctm-mob-dn-ss-br-rs,
1542
+ var(--_ctm-tab-dn-ss-br-rs, var(--_ctm-dn-ss-br-rs))
1543
+ );
1544
+
1545
+ box-shadow: var(
1546
+ --_show-shadow,
1547
+ var(--_ctm-mob-dn-ss-sw-ae, var(--_ctm-tab-dn-ss-sw-ae, var(--_ctm-dn-ss-sw-ae)))
1548
+ var(--_ctm-mob-dn-ss-sw-br, var(--_ctm-tab-dn-ss-sw-br, var(--_ctm-dn-ss-sw-br)))
1549
+ var(--_ctm-mob-dn-ss-sw-sd, var(--_ctm-tab-dn-ss-sw-sd, var(--_ctm-dn-ss-sw-sd)))
1550
+ var(--_ctm-mob-dn-ss-sw-cr, var(--_ctm-tab-dn-ss-sw-cr, var(--_ctm-dn-ss-sw-cr)))
1551
+ );
1552
+ }
1553
+ .savings-value-span {
1554
+ background-color: var(
1555
+ --_ctm-mob-dn-ss-ve-bd-cr,
1556
+ var(--_ctm-tab-dn-ss-ve-bd-cr, var(--_ctm-dn-ss-ve-bd-cr))
1557
+ );
1558
+ color: var(--_ctm-mob-dn-ss-ve-cr, var(--_ctm-tab-dn-ss-ve-cr, var(--_ctm-dn-ss-ve-cr)));
1559
+ font-family: var(
1560
+ --_ctm-mob-dn-ss-ve-ft-fy,
1561
+ var(--_ctm-tab-dn-ss-ve-ft-fy, var(--_ctm-dn-ss-ve-ft-fy))
1562
+ );
1563
+ font-size: var(
1564
+ --_ctm-mob-dn-ss-ve-ft-se,
1565
+ var(--_ctm-tab-dn-ss-ve-ft-se, var(--_ctm-dn-ss-ve-ft-se))
1566
+ );
1567
+ font-weight: var(
1568
+ --_ctm-mob-dn-ss-ve-ft-wt,
1569
+ var(--_ctm-tab-dn-ss-ve-ft-wt, var(--_ctm-dn-ss-ve-ft-wt))
1570
+ );
1571
+ font-style: var(
1572
+ --_ctm-mob-dn-ss-ve-ft-se-ic,
1573
+ var(--_ctm-tab-dn-ss-ve-ft-se-ic, var(--_ctm-dn-ss-ve-ft-se-ic))
1574
+ );
1575
+ text-align: var(
1576
+ --_ctm-mob-dn-ss-ve-tt-an,
1577
+ var(--_ctm-tab-dn-ss-ve-tt-an, var(--_ctm-dn-ss-ve-tt-an))
1578
+ );
1579
+ letter-spacing: var(
1580
+ --_ctm-mob-dn-ss-ve-lr-sg,
1581
+ var(--_ctm-tab-dn-ss-ve-lr-sg, var(--_ctm-dn-ss-ve-lr-sg))
1582
+ );
1583
+ line-height: var(
1584
+ --_ctm-mob-dn-ss-ve-le-ht,
1585
+ var(--_ctm-tab-dn-ss-ve-le-ht, var(--_ctm-dn-ss-ve-le-ht))
1586
+ );
1587
+ text-decoration: var(
1588
+ --_ctm-mob-dn-ss-ve-ue,
1589
+ var(--_ctm-tab-dn-ss-ve-ue, var(--_ctm-dn-ss-ve-ue))
1590
+ );
1591
+
1592
+ border-color: var(
1593
+ --_show-border,
1594
+ var(
1595
+ --_ctm-mob-dn-ss-ve-br-cr,
1596
+ var(--_ctm-tab-dn-ss-ve-br-cr, var(--_ctm-dn-ss-ve-br-cr))
1597
+ )
1598
+ );
1599
+ border-style: var(
1600
+ --_show-border,
1601
+ var(
1602
+ --_ctm-mob-dn-ss-ve-br-se,
1603
+ var(--_ctm-tab-dn-ss-ve-br-se, var(--_ctm-dn-ss-ve-br-se))
1604
+ )
1605
+ );
1606
+ border-width: var(
1607
+ --_show-border,
1608
+ var(
1609
+ --_ctm-mob-dn-ss-ve-br-wh,
1610
+ var(--_ctm-tab-dn-ss-ve-br-wh, var(--_ctm-dn-ss-ve-br-wh))
1611
+ )
1612
+ );
1613
+ border-radius: var(
1614
+ --_ctm-mob-dn-ss-ve-br-rs,
1615
+ var(--_ctm-tab-dn-ss-ve-br-rs, var(--_ctm-dn-ss-ve-br-rs))
1616
+ );
1617
+
1618
+ box-shadow: var(
1619
+ --_show-shadow,
1620
+ var(
1621
+ --_ctm-mob-dn-ss-ve-sw-ae,
1622
+ var(--_ctm-tab-dn-ss-ve-sw-ae, var(--_ctm-dn-ss-ve-sw-ae))
1623
+ )
1624
+ var(
1625
+ --_ctm-mob-dn-ss-ve-sw-br,
1626
+ var(--_ctm-tab-dn-ss-ve-sw-br, var(--_ctm-dn-ss-ve-sw-br))
1627
+ )
1628
+ var(
1629
+ --_ctm-mob-dn-ss-ve-sw-sd,
1630
+ var(--_ctm-tab-dn-ss-ve-sw-sd, var(--_ctm-dn-ss-ve-sw-sd))
1631
+ )
1632
+ var(
1633
+ --_ctm-mob-dn-ss-ve-sw-cr,
1634
+ var(--_ctm-tab-dn-ss-ve-sw-cr, var(--_ctm-dn-ss-ve-sw-cr))
1635
+ )
1636
+ );
1637
+ }
1638
+ .code-span {
1639
+ background-color: var(
1640
+ --_ctm-mob-dn-cy-ce-se-bd-cr,
1641
+ var(--_ctm-tab-dn-cy-ce-se-bd-cr, var(--_ctm-dn-cy-ce-se-bd-cr))
1642
+ );
1643
+ color: var(
1644
+ --_ctm-mob-dn-cy-ce-se-cr,
1645
+ var(--_ctm-tab-dn-cy-ce-se-cr, var(--_ctm-dn-cy-ce-se-cr))
1646
+ );
1647
+ font-family: var(
1648
+ --_ctm-mob-dn-cy-ce-se-ft-fy,
1649
+ var(--_ctm-tab-dn-cy-ce-se-ft-fy, var(--_ctm-dn-cy-ce-se-ft-fy))
1650
+ );
1651
+ font-size: var(
1652
+ --_ctm-mob-dn-cy-ce-se-ft-se,
1653
+ var(--_ctm-tab-dn-cy-ce-se-ft-se, var(--_ctm-dn-cy-ce-se-ft-se))
1654
+ );
1655
+ font-weight: var(
1656
+ --_ctm-mob-dn-cy-ce-se-ft-wt,
1657
+ var(--_ctm-tab-dn-cy-ce-se-ft-wt, var(--_ctm-dn-cy-ce-se-ft-wt))
1658
+ );
1659
+ font-style: var(
1660
+ --_ctm-mob-dn-cy-ce-se-ft-se-ic,
1661
+ var(--_ctm-tab-dn-cy-ce-se-ft-se-ic, var(--_ctm-dn-cy-ce-se-ft-se-ic))
1662
+ );
1663
+ text-align: var(
1664
+ --_ctm-mob-dn-cy-ce-se-tt-an,
1665
+ var(--_ctm-tab-dn-cy-ce-se-tt-an, var(--_ctm-dn-cy-ce-se-tt-an))
1666
+ );
1667
+ letter-spacing: var(
1668
+ --_ctm-mob-dn-cy-ce-se-lr-sg,
1669
+ var(--_ctm-tab-dn-cy-ce-se-lr-sg, var(--_ctm-dn-cy-ce-se-lr-sg))
1670
+ );
1671
+ line-height: var(
1672
+ --_ctm-mob-dn-cy-ce-se-le-ht,
1673
+ var(--_ctm-tab-dn-cy-ce-se-le-ht, var(--_ctm-dn-cy-ce-se-le-ht))
1674
+ );
1675
+ text-decoration: var(
1676
+ --_ctm-mob-dn-cy-ce-se-ue,
1677
+ var(--_ctm-tab-dn-cy-ce-se-ue, var(--_ctm-dn-cy-ce-se-ue))
1678
+ );
1679
+
1680
+ border-color: var(
1681
+ --_show-border,
1682
+ var(
1683
+ --_ctm-mob-dn-cy-ce-se-br-cr,
1684
+ var(--_ctm-tab-dn-cy-ce-se-br-cr, var(--_ctm-dn-cy-ce-se-br-cr))
1685
+ )
1686
+ );
1687
+ border-style: var(
1688
+ --_show-border,
1689
+ var(
1690
+ --_ctm-mob-dn-cy-ce-se-br-se,
1691
+ var(--_ctm-tab-dn-cy-ce-se-br-se, var(--_ctm-dn-cy-ce-se-br-se))
1692
+ )
1693
+ );
1694
+ border-width: var(
1695
+ --_show-border,
1696
+ var(
1697
+ --_ctm-mob-dn-cy-ce-se-br-wh,
1698
+ var(--_ctm-tab-dn-cy-ce-se-br-wh, var(--_ctm-dn-cy-ce-se-br-wh))
1699
+ )
1700
+ );
1701
+ border-radius: var(
1702
+ --_ctm-mob-dn-cy-ce-se-br-rs,
1703
+ var(--_ctm-tab-dn-cy-ce-se-br-rs, var(--_ctm-dn-cy-ce-se-br-rs))
1704
+ );
1705
+
1706
+ box-shadow: var(
1707
+ --_show-shadow,
1708
+ var(
1709
+ --_ctm-mob-dn-cy-ce-se-sw-ae,
1710
+ var(--_ctm-tab-dn-cy-ce-se-sw-ae, var(--_ctm-dn-cy-ce-se-sw-ae))
1711
+ )
1712
+ var(
1713
+ --_ctm-mob-dn-cy-ce-se-sw-br,
1714
+ var(--_ctm-tab-dn-cy-ce-se-sw-br, var(--_ctm-dn-cy-ce-se-sw-br))
1715
+ )
1716
+ var(
1717
+ --_ctm-mob-dn-cy-ce-se-sw-sd,
1718
+ var(--_ctm-tab-dn-cy-ce-se-sw-sd, var(--_ctm-dn-cy-ce-se-sw-sd))
1719
+ )
1720
+ var(
1721
+ --_ctm-mob-dn-cy-ce-se-sw-cr,
1722
+ var(--_ctm-tab-dn-cy-ce-se-sw-cr, var(--_ctm-dn-cy-ce-se-sw-cr))
1723
+ )
1724
+ );
1725
+ }
1726
+ }
1727
+ }
1728
+ .total-price-container {
1729
+ .tax-box {
1730
+ display: flex;
1731
+ align-items: center;
1732
+ justify-content: space-between;
1733
+ gap: 5px;
1734
+
1735
+ background-color: var(
1736
+ --_ctm-mob-dn-pt-tx-bd-cr,
1737
+ var(--_ctm-tab-dn-pt-tx-bd-cr, var(--_ctm-dn-pt-tx-bd-cr))
1738
+ );
1739
+ color: var(--_ctm-mob-dn-pt-tx-cr, var(--_ctm-tab-dn-pt-tx-cr, var(--_ctm-dn-pt-tx-cr)));
1740
+ font-family: var(
1741
+ --_ctm-mob-dn-pt-tx-ft-fy,
1742
+ var(--_ctm-tab-dn-pt-tx-ft-fy, var(--_ctm-dn-pt-tx-ft-fy))
1743
+ );
1744
+ font-size: var(
1745
+ --_ctm-mob-dn-pt-tx-ft-se,
1746
+ var(--_ctm-tab-dn-pt-tx-ft-se, var(--_ctm-dn-pt-tx-ft-se))
1747
+ );
1748
+ font-weight: var(
1749
+ --_ctm-mob-dn-pt-tx-ft-wt,
1750
+ var(--_ctm-tab-dn-pt-tx-ft-wt, var(--_ctm-dn-pt-tx-ft-wt))
1751
+ );
1752
+ font-style: var(
1753
+ --_ctm-mob-dn-pt-tx-ft-se-ic,
1754
+ var(--_ctm-tab-dn-pt-tx-ft-se-ic, var(--_ctm-dn-pt-tx-ft-se-ic))
1755
+ );
1756
+ text-align: var(
1757
+ --_ctm-mob-dn-pt-tx-tt-an,
1758
+ var(--_ctm-tab-dn-pt-tx-tt-an, var(--_ctm-dn-pt-tx-tt-an))
1759
+ );
1760
+ letter-spacing: var(
1761
+ --_ctm-mob-dn-pt-tx-lr-sg,
1762
+ var(--_ctm-tab-dn-pt-tx-lr-sg, var(--_ctm-dn-pt-tx-lr-sg))
1763
+ );
1764
+ line-height: var(
1765
+ --_ctm-mob-dn-pt-tx-le-ht,
1766
+ var(--_ctm-tab-dn-pt-tx-le-ht, var(--_ctm-dn-pt-tx-le-ht))
1767
+ );
1768
+ text-decoration: var(
1769
+ --_ctm-mob-dn-pt-tx-ue,
1770
+ var(--_ctm-tab-dn-pt-tx-ue, var(--_ctm-dn-pt-tx-ue))
1771
+ );
1772
+
1773
+ border-color: var(
1774
+ --_show-border,
1775
+ var(--_ctm-mob-dn-pt-tx-br-cr, var(--_ctm-tab-dn-pt-tx-br-cr, var(--_ctm-dn-pt-tx-br-cr)))
1776
+ );
1777
+ border-style: var(
1778
+ --_show-border,
1779
+ var(--_ctm-mob-dn-pt-tx-br-se, var(--_ctm-tab-dn-pt-tx-br-se, var(--_ctm-dn-pt-tx-br-se)))
1780
+ );
1781
+ border-width: var(
1782
+ --_show-border,
1783
+ var(--_ctm-mob-dn-pt-tx-br-wh, var(--_ctm-tab-dn-pt-tx-br-wh, var(--_ctm-dn-pt-tx-br-wh)))
1784
+ );
1785
+ border-radius: var(
1786
+ --_ctm-mob-dn-pt-tx-br-rs,
1787
+ var(--_ctm-tab-dn-pt-tx-br-rs, var(--_ctm-dn-pt-tx-br-rs))
1788
+ );
1789
+
1790
+ box-shadow: var(
1791
+ --_show-shadow,
1792
+ var(--_ctm-mob-dn-pt-tx-sw-ae, var(--_ctm-tab-dn-pt-tx-sw-ae, var(--_ctm-dn-pt-tx-sw-ae)))
1793
+ var(
1794
+ --_ctm-mob-dn-pt-tx-sw-br,
1795
+ var(--_ctm-tab-dn-pt-tx-sw-br, var(--_ctm-dn-pt-tx-sw-br))
1796
+ )
1797
+ var(
1798
+ --_ctm-mob-dn-pt-tx-sw-sd,
1799
+ var(--_ctm-tab-dn-pt-tx-sw-sd, var(--_ctm-dn-pt-tx-sw-sd))
1800
+ )
1801
+ var(
1802
+ --_ctm-mob-dn-pt-tx-sw-cr,
1803
+ var(--_ctm-tab-dn-pt-tx-sw-cr, var(--_ctm-dn-pt-tx-sw-cr))
1804
+ )
1805
+ );
1806
+ }
1807
+ .shipping-box {
1808
+ display: flex;
1809
+ align-items: center;
1810
+ justify-content: space-between;
1811
+ gap: 5px;
1812
+
1813
+ background-color: var(
1814
+ --_ctm-mob-dn-pt-sg-pe-bd-cr,
1815
+ var(--_ctm-tab-dn-pt-sg-pe-bd-cr, var(--_ctm-dn-pt-sg-pe-bd-cr))
1816
+ );
1817
+ color: var(
1818
+ --_ctm-mob-dn-pt-sg-pe-cr,
1819
+ var(--_ctm-tab-dn-pt-sg-pe-cr, var(--_ctm-dn-pt-sg-pe-cr))
1820
+ );
1821
+ font-family: var(
1822
+ --_ctm-mob-dn-pt-sg-pe-ft-fy,
1823
+ var(--_ctm-tab-dn-pt-sg-pe-ft-fy, var(--_ctm-dn-pt-sg-pe-ft-fy))
1824
+ );
1825
+ font-size: var(
1826
+ --_ctm-mob-dn-pt-sg-pe-ft-se,
1827
+ var(--_ctm-tab-dn-pt-sg-pe-ft-se, var(--_ctm-dn-pt-sg-pe-ft-se))
1828
+ );
1829
+ font-weight: var(
1830
+ --_ctm-mob-dn-pt-sg-pe-ft-wt,
1831
+ var(--_ctm-tab-dn-pt-sg-pe-ft-wt, var(--_ctm-dn-pt-sg-pe-ft-wt))
1832
+ );
1833
+ font-style: var(
1834
+ --_ctm-mob-dn-pt-sg-pe-ft-se-ic,
1835
+ var(--_ctm-tab-dn-pt-sg-pe-ft-se-ic, var(--_ctm-dn-pt-sg-pe-ft-se-ic))
1836
+ );
1837
+ text-align: var(
1838
+ --_ctm-mob-dn-pt-sg-pe-tt-an,
1839
+ var(--_ctm-tab-dn-pt-sg-pe-tt-an, var(--_ctm-dn-pt-sg-pe-tt-an))
1840
+ );
1841
+ letter-spacing: var(
1842
+ --_ctm-mob-dn-pt-sg-pe-lr-sg,
1843
+ var(--_ctm-tab-dn-pt-sg-pe-lr-sg, var(--_ctm-dn-pt-sg-pe-lr-sg))
1844
+ );
1845
+ line-height: var(
1846
+ --_ctm-mob-dn-pt-sg-pe-le-ht,
1847
+ var(--_ctm-tab-dn-pt-sg-pe-le-ht, var(--_ctm-dn-pt-sg-pe-le-ht))
1848
+ );
1849
+ text-decoration: var(
1850
+ --_ctm-mob-dn-pt-sg-pe-ue,
1851
+ var(--_ctm-tab-dn-pt-sg-pe-ue, var(--_ctm-dn-pt-sg-pe-ue))
1852
+ );
1853
+
1854
+ border-color: var(
1855
+ --_show-border,
1856
+ var(
1857
+ --_ctm-mob-dn-pt-sg-pe-br-cr,
1858
+ var(--_ctm-tab-dn-pt-sg-pe-br-cr, var(--_ctm-dn-pt-sg-pe-br-cr))
1859
+ )
1860
+ );
1861
+ border-style: var(
1862
+ --_show-border,
1863
+ var(
1864
+ --_ctm-mob-dn-pt-sg-pe-br-se,
1865
+ var(--_ctm-tab-dn-pt-sg-pe-br-se, var(--_ctm-dn-pt-sg-pe-br-se))
1866
+ )
1867
+ );
1868
+ border-width: var(
1869
+ --_show-border,
1870
+ var(
1871
+ --_ctm-mob-dn-pt-sg-pe-br-wh,
1872
+ var(--_ctm-tab-dn-pt-sg-pe-br-wh, var(--_ctm-dn-pt-sg-pe-br-wh))
1873
+ )
1874
+ );
1875
+ border-radius: var(
1876
+ --_ctm-mob-dn-pt-sg-pe-br-rs,
1877
+ var(--_ctm-tab-dn-pt-sg-pe-br-rs, var(--_ctm-dn-pt-sg-pe-br-rs))
1878
+ );
1879
+
1880
+ box-shadow: var(
1881
+ --_show-shadow,
1882
+ var(
1883
+ --_ctm-mob-dn-pt-sg-pe-sw-ae,
1884
+ var(--_ctm-tab-dn-pt-sg-pe-sw-ae, var(--_ctm-dn-pt-sg-pe-sw-ae))
1885
+ )
1886
+ var(
1887
+ --_ctm-mob-dn-pt-sg-pe-sw-br,
1888
+ var(--_ctm-tab-dn-pt-sg-pe-sw-br, var(--_ctm-dn-pt-sg-pe-sw-br))
1889
+ )
1890
+ var(
1891
+ --_ctm-mob-dn-pt-sg-pe-sw-sd,
1892
+ var(--_ctm-tab-dn-pt-sg-pe-sw-sd, var(--_ctm-dn-pt-sg-pe-sw-sd))
1893
+ )
1894
+ var(
1895
+ --_ctm-mob-dn-pt-sg-pe-sw-cr,
1896
+ var(--_ctm-tab-dn-pt-sg-pe-sw-cr, var(--_ctm-dn-pt-sg-pe-sw-cr))
1897
+ )
1898
+ );
1899
+ }
1900
+ .embellishment-box {
1901
+ display: flex;
1902
+ align-items: center;
1903
+ justify-content: space-between;
1904
+ gap: 5px;
1905
+
1906
+ background-color: var(
1907
+ --_ctm-mob-dn-et-pe-bd-cr,
1908
+ var(--_ctm-tab-dn-et-pe-bd-cr, var(--_ctm-dn-et-pe-bd-cr))
1909
+ );
1910
+ color: var(--_ctm-mob-dn-et-pe-cr, var(--_ctm-tab-dn-et-pe-cr, var(--_ctm-dn-et-pe-cr)));
1911
+ font-family: var(
1912
+ --_ctm-mob-dn-et-pe-ft-fy,
1913
+ var(--_ctm-tab-dn-et-pe-ft-fy, var(--_ctm-dn-et-pe-ft-fy))
1914
+ );
1915
+ font-size: var(
1916
+ --_ctm-mob-dn-et-pe-ft-se,
1917
+ var(--_ctm-tab-dn-et-pe-ft-se, var(--_ctm-dn-et-pe-ft-se))
1918
+ );
1919
+ font-weight: var(
1920
+ --_ctm-mob-dn-et-pe-ft-wt,
1921
+ var(--_ctm-tab-dn-et-pe-ft-wt, var(--_ctm-dn-et-pe-ft-wt))
1922
+ );
1923
+ font-style: var(
1924
+ --_ctm-mob-dn-et-pe-ft-se-ic,
1925
+ var(--_ctm-tab-dn-et-pe-ft-se-ic, var(--_ctm-dn-et-pe-ft-se-ic))
1926
+ );
1927
+ text-align: var(
1928
+ --_ctm-mob-dn-et-pe-tt-an,
1929
+ var(--_ctm-tab-dn-et-pe-tt-an, var(--_ctm-dn-et-pe-tt-an))
1930
+ );
1931
+ letter-spacing: var(
1932
+ --_ctm-mob-dn-et-pe-lr-sg,
1933
+ var(--_ctm-tab-dn-et-pe-lr-sg, var(--_ctm-dn-et-pe-lr-sg))
1934
+ );
1935
+ line-height: var(
1936
+ --_ctm-mob-dn-et-pe-le-ht,
1937
+ var(--_ctm-tab-dn-et-pe-le-ht, var(--_ctm-dn-et-pe-le-ht))
1938
+ );
1939
+ text-decoration: var(
1940
+ --_ctm-mob-dn-et-pe-ue,
1941
+ var(--_ctm-tab-dn-et-pe-ue, var(--_ctm-dn-et-pe-ue))
1942
+ );
1943
+
1944
+ border-color: var(
1945
+ --_show-border,
1946
+ var(--_ctm-mob-dn-et-pe-br-cr, var(--_ctm-tab-dn-et-pe-br-cr, var(--_ctm-dn-et-pe-br-cr)))
1947
+ );
1948
+ border-style: var(
1949
+ --_show-border,
1950
+ var(--_ctm-mob-dn-et-pe-br-se, var(--_ctm-tab-dn-et-pe-br-se, var(--_ctm-dn-et-pe-br-se)))
1951
+ );
1952
+ border-width: var(
1953
+ --_show-border,
1954
+ var(--_ctm-mob-dn-et-pe-br-wh, var(--_ctm-tab-dn-et-pe-br-wh, var(--_ctm-dn-et-pe-br-wh)))
1955
+ );
1956
+ border-radius: var(
1957
+ --_ctm-mob-dn-et-pe-br-rs,
1958
+ var(--_ctm-tab-dn-et-pe-br-rs, var(--_ctm-dn-et-pe-br-rs))
1959
+ );
1960
+
1961
+ box-shadow: var(
1962
+ --_show-shadow,
1963
+ var(--_ctm-mob-dn-et-pe-sw-ae, var(--_ctm-tab-dn-et-pe-sw-ae, var(--_ctm-dn-et-pe-sw-ae)))
1964
+ var(
1965
+ --_ctm-mob-dn-et-pe-sw-br,
1966
+ var(--_ctm-tab-dn-et-pe-sw-br, var(--_ctm-dn-et-pe-sw-br))
1967
+ )
1968
+ var(
1969
+ --_ctm-mob-dn-et-pe-sw-sd,
1970
+ var(--_ctm-tab-dn-et-pe-sw-sd, var(--_ctm-dn-et-pe-sw-sd))
1971
+ )
1972
+ var(
1973
+ --_ctm-mob-dn-et-pe-sw-cr,
1974
+ var(--_ctm-tab-dn-et-pe-sw-cr, var(--_ctm-dn-et-pe-sw-cr))
1975
+ )
1976
+ );
1977
+ }
1978
+ }
1979
+ .price-text-element {
1980
+ // background-color: var(--_ctm-dn-bd-cr, var(--_tst-dn-bd-cr));
1981
+ padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
1982
+ display: flex;
1983
+ flex-direction: column;
1984
+ gap: 10px;
1985
+ --_sf-cd-gp: calc(var(--_sf-gp) * 0.5);
1986
+ // row-gap: var(--_sf-gp);
1987
+ width: 100%;
1988
+ // height: 100%;
1989
+ border-color: var(--_ctm-mob-dn-br-cr, var(--_ctm-tab-dn-br-cr, var(--_ctm-dn-br-cr)));
1990
+ border-style: var(--_ctm-mob-dn-br-se, var(--_ctm-tab-dn-br-se, var(--_ctm-dn-br-se)));
1991
+ border-width: var(--_ctm-mob-dn-br-wh, var(--_ctm-tab-dn-br-wh, var(--_ctm-dn-br-wh)));
1992
+ border-radius: var(--_ctm-mob-dn-br-rs, var(--_ctm-tab-dn-br-rs, var(--_ctm-dn-br-rs)));
1993
+ box-shadow: var(
1994
+ --_show-shadow,
1995
+ var(--_ctm-mob-dn-sw-ae, var(--_ctm-tab-dn-sw-ae, var(--_ctm-dn-sw-ae)))
1996
+ var(--_ctm-mob-dn-sw-br, var(--_ctm-tab-dn-sw-br, var(--_ctm-dn-sw-br)))
1997
+ var(--_ctm-mob-dn-sw-sd, var(--_ctm-tab-dn-sw-sd, var(--_ctm-dn-sw-sd)))
1998
+ var(--_ctm-mob-dn-sw-cr, var(--_ctm-tab-dn-sw-cr, var(--_ctm-dn-sw-cr)))
1999
+ );
2000
+
2001
+ // transform: scale(var(--_ctm-dn-zm-ie));
2002
+ scale: var(--_ctm-mob-dn-zm-ie, var(--_ctm-tab-dn-zm-ie, var(--_ctm-dn-zm-ie)));
2003
+
2004
+ &[data-flip-x="true"] {
2005
+ transform: scaleX(-1);
2006
+ }
2007
+ &[data-flip-y="true"] {
2008
+ transform: scaleY(-1);
2009
+ }
2010
+ .meta_text_element {
2011
+ color: green;
2012
+ //styleName: Text md/Medium;
2013
+ font-family: Lato;
2014
+ font-size: 16px;
2015
+ font-weight: 500;
2016
+ line-height: 24px;
2017
+ text-align: left;
2018
+ text-underline-position: from-font;
2019
+ text-decoration-skip-ink: none;
2020
+ }
2021
+ .price-container {
2022
+ display: flex;
2023
+ align-items: center;
2024
+ gap: 5px;
2025
+ .element-container {
2026
+ display: flex;
2027
+ align-items: flex-start;
2028
+ gap: 10px;
2029
+ flex-direction: column;
2030
+ width: 100%;
2031
+ }
2032
+
2033
+ // Tooltip SCSS Style Starts Here -
2034
+ .tooltipWrapper {
2035
+ position: relative;
2036
+ display: inline-block;
2037
+ cursor: pointer;
2038
+ &:hover {
2039
+ .tooltipBox {
2040
+ opacity: 1;
2041
+ }
2042
+ }
2043
+ }
2044
+
2045
+ .tooltipBox {
2046
+ position: absolute;
2047
+ z-index: 1000;
2048
+ background-color: #333;
2049
+ color: #fff;
2050
+ padding: 8px 12px;
2051
+ border-radius: 4px;
2052
+ font-size: 12px;
2053
+ white-space: nowrap;
2054
+ visibility: visible;
2055
+ opacity: 0;
2056
+ transition: opacity 0.2s ease;
2057
+
2058
+ max-width: 250px;
2059
+ width: max-content;
2060
+ max-height: 100px;
2061
+ word-wrap: break-word;
2062
+ white-space: normal;
2063
+
2064
+ &.top {
2065
+ bottom: 100%;
2066
+ left: 50%;
2067
+ transform: translateX(-50%);
2068
+ margin-bottom: 8px;
2069
+ }
2070
+
2071
+ &.top-left {
2072
+ bottom: 100%;
2073
+ left: 0;
2074
+ transform: translateX(0);
2075
+ margin-bottom: 8px;
2076
+ }
2077
+
2078
+ &.top-right {
2079
+ bottom: 100%;
2080
+ right: 0;
2081
+ transform: translateX(0);
2082
+ margin-bottom: 8px;
2083
+ }
2084
+
2085
+ &.top-center {
2086
+ bottom: 100%;
2087
+ left: 50%;
2088
+ transform: translateX(-50%);
2089
+ margin-bottom: 8px;
2090
+ }
2091
+
2092
+ &.bottom {
2093
+ top: 100%;
2094
+ left: 50%;
2095
+ transform: translateX(-50%);
2096
+ margin-top: 8px;
2097
+ }
2098
+
2099
+ &.bottom-left {
2100
+ top: 100%;
2101
+ left: 0;
2102
+ transform: translateX(0);
2103
+ margin-top: 8px;
2104
+ }
2105
+
2106
+ &.bottom-right {
2107
+ top: 100%;
2108
+ right: 0;
2109
+ transform: translateX(0);
2110
+ margin-top: 8px;
2111
+ }
2112
+
2113
+ &.bottom-center {
2114
+ top: 100%;
2115
+ left: 50%;
2116
+ transform: translateX(-50%);
2117
+ margin-top: 8px;
2118
+ }
2119
+
2120
+ &.left {
2121
+ right: 100%;
2122
+ top: 50%;
2123
+ transform: translateY(-50%);
2124
+ margin-right: 8px;
2125
+ }
2126
+
2127
+ &.left-top {
2128
+ right: 100%;
2129
+ top: 0;
2130
+ transform: translateY(0);
2131
+ margin-right: 8px;
2132
+ }
2133
+
2134
+ &.left-center {
2135
+ right: 100%;
2136
+ top: 50%;
2137
+ transform: translateY(-50%);
2138
+ margin-right: 8px;
2139
+ }
2140
+
2141
+ &.left-bottom {
2142
+ right: 100%;
2143
+ bottom: 0;
2144
+ transform: translateY(0);
2145
+ margin-right: 8px;
2146
+ }
2147
+
2148
+ &.right {
2149
+ left: 100%;
2150
+ top: 50%;
2151
+ transform: translateY(-50%);
2152
+ margin-left: 8px;
2153
+ }
2154
+
2155
+ &.right-top {
2156
+ left: 100%;
2157
+ top: 0;
2158
+ transform: translateY(0);
2159
+ margin-left: 8px;
2160
+ }
2161
+
2162
+ &.right-center {
2163
+ left: 100%;
2164
+ top: 50%;
2165
+ transform: translateY(-50%);
2166
+ margin-left: 8px;
2167
+ }
2168
+
2169
+ &.right-bottom {
2170
+ left: 100%;
2171
+ bottom: 0;
2172
+ transform: translateY(0);
2173
+ margin-left: 8px;
2174
+ }
2175
+ .total-price-container {
2176
+ .tax-box {
2177
+ display: flex;
2178
+ align-items: center;
2179
+ justify-content: space-between;
2180
+ gap: 5px;
2181
+
2182
+ background-color: var(
2183
+ --_ctm-mob-dn-pt-tx-bd-cr,
2184
+ var(--_ctm-tab-dn-pt-tx-bd-cr, var(--_ctm-dn-pt-tx-bd-cr))
2185
+ );
2186
+ color: var(
2187
+ --_ctm-mob-dn-pt-tx-cr,
2188
+ var(--_ctm-tab-dn-pt-tx-cr, var(--_ctm-dn-pt-tx-cr))
2189
+ );
2190
+ font-family: var(
2191
+ --_ctm-mob-dn-pt-tx-ft-fy,
2192
+ var(--_ctm-tab-dn-pt-tx-ft-fy, var(--_ctm-dn-pt-tx-ft-fy))
2193
+ );
2194
+ font-size: var(
2195
+ --_ctm-mob-dn-pt-tx-ft-se,
2196
+ var(--_ctm-tab-dn-pt-tx-ft-se, var(--_ctm-dn-pt-tx-ft-se))
2197
+ );
2198
+ font-weight: var(
2199
+ --_ctm-mob-dn-pt-tx-ft-wt,
2200
+ var(--_ctm-tab-dn-pt-tx-ft-wt, var(--_ctm-dn-pt-tx-ft-wt))
2201
+ );
2202
+ font-style: var(
2203
+ --_ctm-mob-dn-pt-tx-ft-se-ic,
2204
+ var(--_ctm-tab-dn-pt-tx-ft-se-ic, var(--_ctm-dn-pt-tx-ft-se-ic))
2205
+ );
2206
+ text-align: var(
2207
+ --_ctm-mob-dn-pt-tx-tt-an,
2208
+ var(--_ctm-tab-dn-pt-tx-tt-an, var(--_ctm-dn-pt-tx-tt-an))
2209
+ );
2210
+ letter-spacing: var(
2211
+ --_ctm-mob-dn-pt-tx-lr-sg,
2212
+ var(--_ctm-tab-dn-pt-tx-lr-sg, var(--_ctm-dn-pt-tx-lr-sg))
2213
+ );
2214
+ line-height: var(
2215
+ --_ctm-mob-dn-pt-tx-le-ht,
2216
+ var(--_ctm-tab-dn-pt-tx-le-ht, var(--_ctm-dn-pt-tx-le-ht))
2217
+ );
2218
+ text-decoration: var(
2219
+ --_ctm-mob-dn-pt-tx-ue,
2220
+ var(--_ctm-tab-dn-pt-tx-ue, var(--_ctm-dn-pt-tx-ue))
2221
+ );
2222
+
2223
+ border-color: var(
2224
+ --_show-border,
2225
+ var(
2226
+ --_ctm-mob-dn-pt-tx-br-cr,
2227
+ var(--_ctm-tab-dn-pt-tx-br-cr, var(--_ctm-dn-pt-tx-br-cr))
2228
+ )
2229
+ );
2230
+ border-style: var(
2231
+ --_show-border,
2232
+ var(
2233
+ --_ctm-mob-dn-pt-tx-br-se,
2234
+ var(--_ctm-tab-dn-pt-tx-br-se, var(--_ctm-dn-pt-tx-br-se))
2235
+ )
2236
+ );
2237
+ border-width: var(
2238
+ --_show-border,
2239
+ var(
2240
+ --_ctm-mob-dn-pt-tx-br-wh,
2241
+ var(--_ctm-tab-dn-pt-tx-br-wh, var(--_ctm-dn-pt-tx-br-wh))
2242
+ )
2243
+ );
2244
+ border-radius: var(
2245
+ --_ctm-mob-dn-pt-tx-br-rs,
2246
+ var(--_ctm-tab-dn-pt-tx-br-rs, var(--_ctm-dn-pt-tx-br-rs))
2247
+ );
2248
+
2249
+ box-shadow: var(
2250
+ --_show-shadow,
2251
+ var(
2252
+ --_ctm-mob-dn-pt-tx-sw-ae,
2253
+ var(--_ctm-tab-dn-pt-tx-sw-ae, var(--_ctm-dn-pt-tx-sw-ae))
2254
+ )
2255
+ var(
2256
+ --_ctm-mob-dn-pt-tx-sw-br,
2257
+ var(--_ctm-tab-dn-pt-tx-sw-br, var(--_ctm-dn-pt-tx-sw-br))
2258
+ )
2259
+ var(
2260
+ --_ctm-mob-dn-pt-tx-sw-sd,
2261
+ var(--_ctm-tab-dn-pt-tx-sw-sd, var(--_ctm-dn-pt-tx-sw-sd))
2262
+ )
2263
+ var(
2264
+ --_ctm-mob-dn-pt-tx-sw-cr,
2265
+ var(--_ctm-tab-dn-pt-tx-sw-cr, var(--_ctm-dn-pt-tx-sw-cr))
2266
+ )
2267
+ );
2268
+ }
2269
+
2270
+ .shipping-box {
2271
+ display: flex;
2272
+ align-items: center;
2273
+ justify-content: space-between;
2274
+ gap: 5px;
2275
+
2276
+ background-color: var(
2277
+ --_ctm-mob-dn-pt-sg-pe-bd-cr,
2278
+ var(--_ctm-tab-dn-pt-sg-pe-bd-cr, var(--_ctm-dn-pt-sg-pe-bd-cr))
2279
+ );
2280
+ color: var(
2281
+ --_ctm-mob-dn-pt-sg-pe-cr,
2282
+ var(--_ctm-tab-dn-pt-sg-pe-cr, var(--_ctm-dn-pt-sg-pe-cr))
2283
+ );
2284
+ font-family: var(
2285
+ --_ctm-mob-dn-pt-sg-pe-ft-fy,
2286
+ var(--_ctm-tab-dn-pt-sg-pe-ft-fy, var(--_ctm-dn-pt-sg-pe-ft-fy))
2287
+ );
2288
+ font-size: var(
2289
+ --_ctm-mob-dn-pt-sg-pe-ft-se,
2290
+ var(--_ctm-tab-dn-pt-sg-pe-ft-se, var(--_ctm-dn-pt-sg-pe-ft-se))
2291
+ );
2292
+ font-weight: var(
2293
+ --_ctm-mob-dn-pt-sg-pe-ft-wt,
2294
+ var(--_ctm-tab-dn-pt-sg-pe-ft-wt, var(--_ctm-dn-pt-sg-pe-ft-wt))
2295
+ );
2296
+ font-style: var(
2297
+ --_ctm-mob-dn-pt-sg-pe-ft-se-ic,
2298
+ var(--_ctm-tab-dn-pt-sg-pe-ft-se-ic, var(--_ctm-dn-pt-sg-pe-ft-se-ic))
2299
+ );
2300
+ text-align: var(
2301
+ --_ctm-mob-dn-pt-sg-pe-tt-an,
2302
+ var(--_ctm-tab-dn-pt-sg-pe-tt-an, var(--_ctm-dn-pt-sg-pe-tt-an))
2303
+ );
2304
+ letter-spacing: var(
2305
+ --_ctm-mob-dn-pt-sg-pe-lr-sg,
2306
+ var(--_ctm-tab-dn-pt-sg-pe-lr-sg, var(--_ctm-dn-pt-sg-pe-lr-sg))
2307
+ );
2308
+ line-height: var(
2309
+ --_ctm-mob-dn-pt-sg-pe-le-ht,
2310
+ var(--_ctm-tab-dn-pt-sg-pe-le-ht, var(--_ctm-dn-pt-sg-pe-le-ht))
2311
+ );
2312
+ text-decoration: var(
2313
+ --_ctm-mob-dn-pt-sg-pe-ue,
2314
+ var(--_ctm-tab-dn-pt-sg-pe-ue, var(--_ctm-dn-pt-sg-pe-ue))
2315
+ );
2316
+
2317
+ border-color: var(
2318
+ --_show-border,
2319
+ var(
2320
+ --_ctm-mob-dn-pt-sg-pe-br-cr,
2321
+ var(--_ctm-tab-dn-pt-sg-pe-br-cr, var(--_ctm-dn-pt-sg-pe-br-cr))
2322
+ )
2323
+ );
2324
+ border-style: var(
2325
+ --_show-border,
2326
+ var(
2327
+ --_ctm-mob-dn-pt-sg-pe-br-se,
2328
+ var(--_ctm-tab-dn-pt-sg-pe-br-se, var(--_ctm-dn-pt-sg-pe-br-se))
2329
+ )
2330
+ );
2331
+ border-width: var(
2332
+ --_show-border,
2333
+ var(
2334
+ --_ctm-mob-dn-pt-sg-pe-br-wh,
2335
+ var(--_ctm-tab-dn-pt-sg-pe-br-wh, var(--_ctm-dn-pt-sg-pe-br-wh))
2336
+ )
2337
+ );
2338
+ border-radius: var(
2339
+ --_ctm-mob-dn-pt-sg-pe-br-rs,
2340
+ var(--_ctm-tab-dn-pt-sg-pe-br-rs, var(--_ctm-dn-pt-sg-pe-br-rs))
2341
+ );
2342
+
2343
+ box-shadow: var(
2344
+ --_show-shadow,
2345
+ var(
2346
+ --_ctm-mob-dn-pt-sg-pe-sw-ae,
2347
+ var(--_ctm-tab-dn-pt-sg-pe-sw-ae, var(--_ctm-dn-pt-sg-pe-sw-ae))
2348
+ )
2349
+ var(
2350
+ --_ctm-mob-dn-pt-sg-pe-sw-br,
2351
+ var(--_ctm-tab-dn-pt-sg-pe-sw-br, var(--_ctm-dn-pt-sg-pe-sw-br))
2352
+ )
2353
+ var(
2354
+ --_ctm-mob-dn-pt-sg-pe-sw-sd,
2355
+ var(--_ctm-tab-dn-pt-sg-pe-sw-sd, var(--_ctm-dn-pt-sg-pe-sw-sd))
2356
+ )
2357
+ var(
2358
+ --_ctm-mob-dn-pt-sg-pe-sw-cr,
2359
+ var(--_ctm-tab-dn-pt-sg-pe-sw-cr, var(--_ctm-dn-pt-sg-pe-sw-cr))
2360
+ )
2361
+ );
2362
+ }
2363
+
2364
+ .embellishment-box {
2365
+ display: flex;
2366
+ align-items: center;
2367
+ justify-content: space-between;
2368
+ gap: 5px;
2369
+
2370
+ background-color: var(
2371
+ --_ctm-mob-dn-et-pe-bd-cr,
2372
+ var(--_ctm-tab-dn-et-pe-bd-cr, var(--_ctm-dn-et-pe-bd-cr))
2373
+ );
2374
+ color: var(
2375
+ --_ctm-mob-dn-et-pe-cr,
2376
+ var(--_ctm-tab-dn-et-pe-cr, var(--_ctm-dn-et-pe-cr))
2377
+ );
2378
+ font-family: var(
2379
+ --_ctm-mob-dn-et-pe-ft-fy,
2380
+ var(--_ctm-tab-dn-et-pe-ft-fy, var(--_ctm-dn-et-pe-ft-fy))
2381
+ );
2382
+ font-size: var(
2383
+ --_ctm-mob-dn-et-pe-ft-se,
2384
+ var(--_ctm-tab-dn-et-pe-ft-se, var(--_ctm-dn-et-pe-ft-se))
2385
+ );
2386
+ font-weight: var(
2387
+ --_ctm-mob-dn-et-pe-ft-wt,
2388
+ var(--_ctm-tab-dn-et-pe-ft-wt, var(--_ctm-dn-et-pe-ft-wt))
2389
+ );
2390
+ font-style: var(
2391
+ --_ctm-mob-dn-et-pe-ft-se-ic,
2392
+ var(--_ctm-tab-dn-et-pe-ft-se-ic, var(--_ctm-dn-et-pe-ft-se-ic))
2393
+ );
2394
+ text-align: var(
2395
+ --_ctm-mob-dn-et-pe-tt-an,
2396
+ var(--_ctm-tab-dn-et-pe-tt-an, var(--_ctm-dn-et-pe-tt-an))
2397
+ );
2398
+ letter-spacing: var(
2399
+ --_ctm-mob-dn-et-pe-lr-sg,
2400
+ var(--_ctm-tab-dn-et-pe-lr-sg, var(--_ctm-dn-et-pe-lr-sg))
2401
+ );
2402
+ line-height: var(
2403
+ --_ctm-mob-dn-et-pe-le-ht,
2404
+ var(--_ctm-tab-dn-et-pe-le-ht, var(--_ctm-dn-et-pe-le-ht))
2405
+ );
2406
+ text-decoration: var(
2407
+ --_ctm-mob-dn-et-pe-ue,
2408
+ var(--_ctm-tab-dn-et-pe-ue, var(--_ctm-dn-et-pe-ue))
2409
+ );
2410
+
2411
+ border-color: var(
2412
+ --_show-border,
2413
+ var(
2414
+ --_ctm-mob-dn-et-pe-br-cr,
2415
+ var(--_ctm-tab-dn-et-pe-br-cr, var(--_ctm-dn-et-pe-br-cr))
2416
+ )
2417
+ );
2418
+ border-style: var(
2419
+ --_show-border,
2420
+ var(
2421
+ --_ctm-mob-dn-et-pe-br-se,
2422
+ var(--_ctm-tab-dn-et-pe-br-se, var(--_ctm-dn-et-pe-br-se))
2423
+ )
2424
+ );
2425
+ border-width: var(
2426
+ --_show-border,
2427
+ var(
2428
+ --_ctm-mob-dn-et-pe-br-wh,
2429
+ var(--_ctm-tab-dn-et-pe-br-wh, var(--_ctm-dn-et-pe-br-wh))
2430
+ )
2431
+ );
2432
+ border-radius: var(
2433
+ --_ctm-mob-dn-et-pe-br-rs,
2434
+ var(--_ctm-tab-dn-et-pe-br-rs, var(--_ctm-dn-et-pe-br-rs))
2435
+ );
2436
+
2437
+ box-shadow: var(
2438
+ --_show-shadow,
2439
+ var(
2440
+ --_ctm-mob-dn-et-pe-sw-ae,
2441
+ var(--_ctm-tab-dn-et-pe-sw-ae, var(--_ctm-dn-et-pe-sw-ae))
2442
+ )
2443
+ var(
2444
+ --_ctm-mob-dn-et-pe-sw-br,
2445
+ var(--_ctm-tab-dn-et-pe-sw-br, var(--_ctm-dn-et-pe-sw-br))
2446
+ )
2447
+ var(
2448
+ --_ctm-mob-dn-et-pe-sw-sd,
2449
+ var(--_ctm-tab-dn-et-pe-sw-sd, var(--_ctm-dn-et-pe-sw-sd))
2450
+ )
2451
+ var(
2452
+ --_ctm-mob-dn-et-pe-sw-cr,
2453
+ var(--_ctm-tab-dn-et-pe-sw-cr, var(--_ctm-dn-et-pe-sw-cr))
2454
+ )
2455
+ );
2456
+ }
2457
+ }
2458
+ }
2459
+
2460
+ .tooltipArrow {
2461
+ position: absolute;
2462
+ width: 0;
2463
+ height: 0;
2464
+ border-style: solid;
2465
+
2466
+ &.top {
2467
+ bottom: -4px;
2468
+ left: 50%;
2469
+ transform: translateX(-50%);
2470
+ border-width: 4px 4px 0 4px;
2471
+ border-color: #333 transparent transparent transparent;
2472
+ }
2473
+
2474
+ &.top-left {
2475
+ bottom: -4px;
2476
+ left: 10px;
2477
+ transform: translateX(0);
2478
+ border-width: 4px 4px 0 4px;
2479
+ border-color: #333 transparent transparent transparent;
2480
+ }
2481
+
2482
+ &.top-right {
2483
+ bottom: -4px;
2484
+ right: 10px;
2485
+ transform: translateX(0);
2486
+ border-width: 4px 4px 0 4px;
2487
+ border-color: #333 transparent transparent transparent;
2488
+ }
2489
+
2490
+ &.top-center {
2491
+ bottom: -4px;
2492
+ left: 50%;
2493
+ transform: translateX(-50%);
2494
+ border-width: 4px 4px 0 4px;
2495
+ border-color: #333 transparent transparent transparent;
2496
+ }
2497
+
2498
+ &.bottom {
2499
+ top: -4px;
2500
+ left: 50%;
2501
+ transform: translateX(-50%);
2502
+ border-width: 0 4px 4px 4px;
2503
+ border-color: transparent transparent #333 transparent;
2504
+ }
2505
+
2506
+ &.bottom-left {
2507
+ top: -4px;
2508
+ left: 10px;
2509
+ transform: translateX(0);
2510
+ border-width: 0 4px 4px 4px;
2511
+ border-color: transparent transparent #333 transparent;
2512
+ }
2513
+
2514
+ &.bottom-right {
2515
+ top: -4px;
2516
+ right: 10px;
2517
+ transform: translateX(0);
2518
+ border-width: 0 4px 4px 4px;
2519
+ border-color: transparent transparent #333 transparent;
2520
+ }
2521
+
2522
+ &.bottom-center {
2523
+ top: -4px;
2524
+ left: 50%;
2525
+ transform: translateX(-50%);
2526
+ border-width: 0 4px 4px 4px;
2527
+ border-color: transparent transparent #333 transparent;
2528
+ }
2529
+
2530
+ &.left {
2531
+ right: -4px;
2532
+ top: 50%;
2533
+ transform: translateY(-50%);
2534
+ border-width: 4px 0 4px 4px;
2535
+ border-color: transparent transparent transparent #333;
2536
+ }
2537
+
2538
+ &.left-top {
2539
+ right: -4px;
2540
+ top: 10px;
2541
+ transform: translateY(0);
2542
+ border-width: 4px 0 4px 4px;
2543
+ border-color: transparent transparent transparent #333;
2544
+ }
2545
+
2546
+ &.left-center {
2547
+ right: -4px;
2548
+ top: 50%;
2549
+ transform: translateY(-50%);
2550
+ border-width: 4px 0 4px 4px;
2551
+ border-color: transparent transparent transparent #333;
2552
+ }
2553
+
2554
+ &.left-bottom {
2555
+ right: -4px;
2556
+ bottom: 10px;
2557
+ transform: translateY(0);
2558
+ border-width: 4px 0 4px 4px;
2559
+ border-color: transparent transparent transparent #333;
2560
+ }
2561
+
2562
+ &.right {
2563
+ left: -4px;
2564
+ top: 50%;
2565
+ transform: translateY(-50%);
2566
+ border-width: 4px 4px 4px 0;
2567
+ border-color: transparent #333 transparent transparent;
2568
+ }
2569
+
2570
+ &.right-top {
2571
+ left: -4px;
2572
+ top: 10px;
2573
+ transform: translateY(0);
2574
+ border-width: 4px 4px 4px 0;
2575
+ border-color: transparent #333 transparent transparent;
2576
+ }
2577
+
2578
+ &.right-center {
2579
+ left: -4px;
2580
+ top: 50%;
2581
+ transform: translateY(-50%);
2582
+ border-width: 4px 4px 4px 0;
2583
+ border-color: transparent #333 transparent transparent;
2584
+ }
2585
+
2586
+ &.right-bottom {
2587
+ left: -4px;
2588
+ bottom: 10px;
2589
+ transform: translateY(0);
2590
+ border-width: 4px 4px 4px 0;
2591
+ border-color: transparent #333 transparent transparent;
2592
+ }
2593
+ }
2594
+ // Tooltip SCSS Style Ends Here -
2595
+ }
2596
+ }
2597
+ }
2598
+ }