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

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 (185) 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/add-products-tab-details.scss +3818 -0
  5. package/dist/add-products-tab.scss +968 -3031
  6. package/dist/allocationDetails.scss +2247 -2247
  7. package/dist/allocations.scss +1603 -1604
  8. package/dist/amount-estimator.scss +1083 -1083
  9. package/dist/animation-control.scss +23 -23
  10. package/dist/badge.scss +388 -388
  11. package/dist/brand-basic-elements.scss +292 -292
  12. package/dist/brand.scss +93 -93
  13. package/dist/breadcrumbs.scss +802 -802
  14. package/dist/builder.js +1 -1
  15. package/dist/bulk-order-pad.scss +677 -677
  16. package/dist/bulk-variant-picker copy.scss +1121 -1121
  17. package/dist/bulk-variant-picker.scss +3294 -3092
  18. package/dist/bundle copy.scss +2805 -2805
  19. package/dist/bundle.scss +2383 -2383
  20. package/dist/bundleDetails copy.scss +1431 -1431
  21. package/dist/bundleDetails.scss +3320 -3285
  22. package/dist/button copy.scss +271 -271
  23. package/dist/button.scss +292 -292
  24. package/dist/buy-for-tab-container.scss +90 -90
  25. package/dist/buy-for-tab.scss +3 -4
  26. package/dist/buy-for-tabs-container-item.scss +80 -80
  27. package/dist/buyForHeaders.scss +6718 -6718
  28. package/dist/buyForPopup.scss +70 -52
  29. package/dist/cart-details.scss +3207 -2386
  30. package/dist/cart-products-sidebar.scss +211 -211
  31. package/dist/cart-summary.scss +2728 -2728
  32. package/dist/cart-wrapper.scss +127 -127
  33. package/dist/cart.scss +269 -269
  34. package/dist/cartAttributes.scss +935 -903
  35. package/dist/cartDropdownOverlay.scss +514 -231
  36. package/dist/cartGrouping.scss +89 -89
  37. package/dist/category-groups-element.scss +138 -138
  38. package/dist/category.scss +73 -73
  39. package/dist/categoryDetails.scss +61 -61
  40. package/dist/categoryWidget.scss +34 -34
  41. package/dist/checkbox-radio.scss +124 -124
  42. package/dist/checkout.scss +6460 -6569
  43. package/dist/code-temp.scss +58 -58
  44. package/dist/colorpicker_v2.scss +52 -52
  45. package/dist/common-element.scss +35 -35
  46. package/dist/confirm-modal.scss +351 -351
  47. package/dist/confirmationModal.scss +139 -139
  48. package/dist/contact-us.scss +105 -105
  49. package/dist/container.scss +114 -114
  50. package/dist/countdown.scss +751 -751
  51. package/dist/coupon.scss +1254 -1254
  52. package/dist/custom-fonts.scss +100 -100
  53. package/dist/customization-tree.scss +160 -160
  54. package/dist/default-dropdown.scss +240 -240
  55. package/dist/dropdownTemplate.scss +98 -46
  56. package/dist/editCartItem.scss +111 -111
  57. package/dist/embed-temp.scss +72 -72
  58. package/dist/embroider-preview-element.scss +94 -94
  59. package/dist/embroider-template-1-v2.scss +937 -937
  60. package/dist/embroider-template-1.scss +482 -482
  61. package/dist/embroidery.scss +213 -213
  62. package/dist/employee-bulk-order.scss +4057 -4057
  63. package/dist/emtpy-templates.scss +165 -165
  64. package/dist/faq.scss +564 -564
  65. package/dist/fb-dropdown.scss +125 -125
  66. package/dist/filter-results.scss +323 -323
  67. package/dist/filters.scss +2418 -2418
  68. package/dist/flex-text-editor.scss +271 -271
  69. package/dist/form-preview.scss +290 -290
  70. package/dist/form-zindex-module.scss +24 -24
  71. package/dist/gallery-slider-temp.scss +1234 -1234
  72. package/dist/global-styles.scss +86 -86
  73. package/dist/grid.scss +119 -119
  74. package/dist/hotspot.scss +397 -397
  75. package/dist/icon-library.scss +74 -74
  76. package/dist/icon-list.scss +268 -268
  77. package/dist/image-for-product.scss +21 -21
  78. package/dist/image-temp.scss +168 -168
  79. package/dist/item-stock.scss +87 -87
  80. package/dist/language-selector.scss +528 -558
  81. package/dist/layouter-item.scss +89 -89
  82. package/dist/layouter-pro-item.scss +80 -80
  83. package/dist/layouter-pro.scss +88 -88
  84. package/dist/layouter.scss +294 -294
  85. package/dist/light-box-v2.scss +105 -105
  86. package/dist/lightbox.scss +78 -78
  87. package/dist/line.scss +166 -166
  88. package/dist/loader.scss +37 -37
  89. package/dist/login.scss +1473 -1473
  90. package/dist/map.scss +962 -962
  91. package/dist/marchandiserSets.scss +60 -60
  92. package/dist/mega-menu-container.scss +99 -99
  93. package/dist/mega-menu.scss +838 -838
  94. package/dist/menu-item.scss +19 -19
  95. package/dist/menu-v2.scss +730 -730
  96. package/dist/menu.scss +162 -162
  97. package/dist/modal.scss +2267 -2267
  98. package/dist/multi-select-dropdown.scss +282 -279
  99. package/dist/my-templates.scss +463 -463
  100. package/dist/my-wishlist.scss +17 -17
  101. package/dist/option-bar.scss +845 -845
  102. package/dist/order-processing.scss +61 -61
  103. package/dist/order-status.scss +1856 -1856
  104. package/dist/overflow-module.scss +63 -63
  105. package/dist/past-orders.scss +975 -975
  106. package/dist/payment-methods.scss +289 -289
  107. package/dist/pickup-locations.scss +1167 -1167
  108. package/dist/position-module.scss +95 -95
  109. package/dist/prefix-list.scss +86 -86
  110. package/dist/product-actions copy.scss +2765 -2765
  111. package/dist/product-actions.scss +2286 -2286
  112. package/dist/product-basic-elements.scss +770 -770
  113. package/dist/product-customizations.scss +149 -149
  114. package/dist/product-highlights copy.scss +217 -217
  115. package/dist/product-highlights.scss +311 -311
  116. package/dist/product-image copy.scss +787 -787
  117. package/dist/product-image-bundles.scss +1512 -0
  118. package/dist/product-image.scss +1 -1
  119. package/dist/product-inventory.scss +1378 -1378
  120. package/dist/product-options.scss +1144 -1144
  121. package/dist/product-price.scss +2598 -2598
  122. package/dist/product-promotions.scss +2759 -2759
  123. package/dist/product-sizechart.scss +1826 -1826
  124. package/dist/product.scss +97 -97
  125. package/dist/productDetails.scss +70 -70
  126. package/dist/profile.scss +4 -3
  127. package/dist/quantity-selector.scss +3 -2
  128. package/dist/quick-links.scss +552 -552
  129. package/dist/quick-order-pad.scss +237 -237
  130. package/dist/quota-details.scss +263 -263
  131. package/dist/quotes.scss +737 -737
  132. package/dist/repeater copy.scss +635 -635
  133. package/dist/repeater-embla-controls.scss +6 -3
  134. package/dist/repeater-grid-toggle.scss +58 -58
  135. package/dist/repeater-item.scss +90 -90
  136. package/dist/repeater.scss +915 -915
  137. package/dist/request-for-quotes.scss +746 -746
  138. package/dist/responsive-behaviour.scss +29 -29
  139. package/dist/rfqs.scss +736 -736
  140. package/dist/scroll.scss +222 -222
  141. package/dist/search-results-heading.scss +279 -279
  142. package/dist/search.scss +296 -296
  143. package/dist/section.scss +209 -209
  144. package/dist/shareCartSideBar.scss +254 -254
  145. package/dist/shipping-estimator.scss +41 -41
  146. package/dist/shipping-payments.scss +2467 -2467
  147. package/dist/simple-list.scss +259 -259
  148. package/dist/skeleton.scss +74 -74
  149. package/dist/social.scss +276 -276
  150. package/dist/sort.scss +89 -89
  151. package/dist/spotlight.scss +1663 -1663
  152. package/dist/stack.scss +129 -129
  153. package/dist/static-global.scss +198 -0
  154. package/dist/static-text.scss +52 -52
  155. package/dist/stockStatus.scss +64 -64
  156. package/dist/store-locations.scss +1398 -1398
  157. package/dist/sub-category.scss +74 -74
  158. package/dist/submit-quote.scss +275 -275
  159. package/dist/tab-container-item.scss +80 -80
  160. package/dist/tab-container.scss +89 -89
  161. package/dist/tab-v2.scss +583 -583
  162. package/dist/table-common.scss +506 -506
  163. package/dist/table.scss +685 -685
  164. package/dist/tabs.scss +395 -395
  165. package/dist/text-temp-v2.scss +139 -139
  166. package/dist/text-temp.scss +109 -109
  167. package/dist/theme-classes.scss +296 -296
  168. package/dist/toaster.scss +350 -350
  169. package/dist/toggle-button.scss +32 -32
  170. package/dist/transform-properties-module.scss +20 -20
  171. package/dist/types/builder/tools/element-edit/addProductsTab.d.ts +1945 -381
  172. package/dist/types/builder/tools/element-edit/bulkVariantPicker.d.ts +1 -1
  173. package/dist/types/builder/tools/element-edit/bundleDetails.d.ts +9 -0
  174. package/dist/types/builder/tools/element-edit/cartAttributes.d.ts +66 -0
  175. package/dist/uom-selector.scss +1169 -1169
  176. package/dist/user-elements copy.scss +1437 -1437
  177. package/dist/user-elements.scss +2471 -2471
  178. package/dist/variant-picker.scss +2384 -2384
  179. package/dist/video.scss +476 -476
  180. package/dist/volume-pricing copy 2.scss +1468 -1468
  181. package/dist/volume-pricing copy.scss +1077 -1077
  182. package/dist/volume-pricing.scss +1175 -1175
  183. package/dist/widget.scss +148 -148
  184. package/dist/wishlist-overlay.scss +48 -48
  185. package/package.json +1 -1
package/dist/amount-estimator.scss CHANGED
@@ -1,1083 +1,1083 @@
1
- @use "sass:map";
2
- @use "sass:list";
3
-
4
- [data-div-type="element"] {
5
- &[data-element-type="amountEstimator"] {
6
- // width: var(--_lt-wh);
7
- // height: var(--_lt-ht);
8
- // margin: var(--_lt-mn);
9
- // padding: var(--_lt-pg);
10
- // width: var(--_ctm-lt-wh, var(--_tst-lt-wh));
11
- // width: var(--_sf-nw-wh, var(--_tst-lt-wh));
12
- margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));
13
- // height: var(--_ctm-lt-ht, var(--_tst-lt-ht));
14
- // height: ;
15
- // aspect-ratio: 1 / var(--_sf-aspect-ratio);
16
- // --_aspect-ratio: calc(
17
- // 1 * (var(--_ctm-lt-ht, var(--_tst-lt-ht)) / var(--_ctm-lt-wh, var(--_tst-lt-wh)))
18
- // );
19
-
20
- & > .wrapper {
21
- width: 100%;
22
- // height: 100%;
23
- }
24
- &[data-show-shadow="false"] {
25
- --_show-shadow: none;
26
- }
27
- .text-element {
28
- background: #6d96e4;
29
- padding: 10px;
30
- font-weight: 600;
31
- color: rgba(75, 69, 70, 1);
32
- }
33
- .amount__estimator_container {
34
- background-color: var(
35
- --_ctm-mob-dn-wt-se-bd-cr,
36
- var(--_ctm-tab-dn-wt-se-bd-cr, var(--_ctm-dn-wt-se-bd-cr))
37
- );
38
- padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
39
- display: flex;
40
- flex-direction: column;
41
- --_sf-gp: var(
42
- --_ctm-mob-lt-im-sg,
43
- var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg, var(--_ctm-lt-im-sg), 16px))
44
- );
45
- --_sf-cd-gp: calc(var(--_sf-gp) * 0.5);
46
- row-gap: var(--_sf-gp);
47
- width: 100%;
48
- // height: 100%;
49
- border-color: var(
50
- --_ctm-mob-dn-wt-se-br-cr,
51
- var(--_ctm-tab-dn-wt-se-br-cr, var(--_ctm-dn-wt-se-br-cr))
52
- );
53
- border-style: var(
54
- --_ctm-mob-dn-wt-se-br-se,
55
- var(--_ctm-tab-dn-wt-se-br-se, var(--_ctm-dn-wt-se-br-se))
56
- );
57
- border-width: var(
58
- --_ctm-mob-dn-wt-se-br-wh,
59
- var(--_ctm-tab-dn-wt-se-br-wh, var(--_ctm-dn-wt-se-br-wh))
60
- );
61
- border-radius: var(
62
- --_ctm-mob-dn-wt-se-br-rs,
63
- var(--_ctm-tab-dn-wt-se-br-rs, var(--_ctm-dn-wt-se-br-rs))
64
- );
65
- box-shadow: var(
66
- --_show-shadow,
67
- var(--_ctm-mob-dn-wt-se-sw-ae, var(--_ctm-tab-dn-wt-se-sw-ae, var(--_ctm-dn-wt-se-sw-ae)))
68
- var(--_ctm-mob-dn-wt-se-sw-br, var(--_ctm-tab-dn-wt-se-sw-br, var(--_ctm-dn-wt-se-sw-br)))
69
- var(--_ctm-mob-dn-wt-se-sw-sd, var(--_ctm-tab-dn-wt-se-sw-sd, var(--_ctm-dn-wt-se-sw-sd)))
70
- var(--_ctm-mob-dn-wt-se-sw-cr, var(--_ctm-tab-dn-wt-se-sw-cr, var(--_ctm-dn-wt-se-sw-cr)))
71
- );
72
- .button_main {
73
- border: 1px solid var(--_gray-600);
74
- width: 100%;
75
- height: auto;
76
- overflow-y: auto;
77
- // padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
78
- //Input button group
79
- .input__btn__group {
80
- display: flex;
81
- align-items: center;
82
- gap: 8px;
83
- color: #fff;
84
- font-weight: 600;
85
- font-size: 16px;
86
- width: 100%;
87
- border-radius: 6px;
88
- // & > div {
89
- // width: 100%;
90
- // }
91
-
92
- .search-container {
93
- width: 100%;
94
- height: 100%;
95
- &.dropdown {
96
- &:focus-within {
97
- .dropdown__options {
98
- display: block;
99
- }
100
- }
101
- }
102
- }
103
-
104
- .search-wrapper {
105
- display: flex;
106
- align-items: center;
107
- width: 100%;
108
- height: 100%;
109
- border: 1px solid var(--_gray-200);
110
- background-color: var(
111
- --_ctm-mob-dn-sh-br-bd-cr,
112
- var(--_ctm-tab-dn-sh-br-bd-cr, var(--_ctm-dn-sh-br-bd-cr))
113
- );
114
- border-color: var(
115
- --_ctm-mob-dn-sh-br-br-cr,
116
- var(--_ctm-tab-dn-sh-br-br-cr, var(--_ctm-dn-sh-br-br-cr))
117
- );
118
- border-style: var(
119
- --_ctm-mob-dn-sh-br-br-se,
120
- var(--_ctm-tab-dn-sh-br-br-se, var(--_ctm-dn-sh-br-br-se))
121
- );
122
- border-width: var(
123
- --_ctm-mob-dn-sh-br-br-wh,
124
- var(--_ctm-tab-dn-sh-br-br-wh, var(--_ctm-dn-sh-br-br-wh))
125
- );
126
- box-shadow: var(
127
- --_show-shadow,
128
- var(
129
- --_ctm-mob-dn-sh-br-sw-ae,
130
- var(--_ctm-tab-dn-sh-br-sw-ae, var(--_ctm-dn-sh-br-sw-ae))
131
- )
132
- var(
133
- --_ctm-mob-dn-sh-br-sw-br,
134
- var(--_ctm-tab-dn-sh-br-sw-br, var(--_ctm-dn-sh-br-sw-br))
135
- )
136
- var(
137
- --_ctm-mob-dn-sh-br-sw-sd,
138
- var(--_ctm-tab-dn-sh-br-sw-sd, var(--_ctm-dn-sh-br-sw-sd))
139
- )
140
- var(
141
- --_ctm-mob-dn-sh-br-sw-cr,
142
- var(--_ctm-tab-dn-sh-br-sw-cr, var(--_ctm-dn-sh-br-sw-cr))
143
- )
144
- );
145
- border-radius: var(
146
- --_ctm-mob-dn-sh-br-br-rs,
147
- var(--_ctm-tab-dn-sh-br-br-rs, var(--_ctm-dn-sh-br-br-rs))
148
- );
149
-
150
- .search-icon {
151
- font-size: 18px;
152
- margin-right: 8px;
153
- color: #555;
154
- }
155
-
156
- .search-input {
157
- flex-grow: 1;
158
- border: none;
159
- outline: none;
160
- padding: 8px;
161
- font-size: 14px;
162
- color: #333;
163
- background: transparent;
164
- border-radius: 6px;
165
-
166
- &::placeholder {
167
- color: var(
168
- --_ctm-mob-dn-pr-tt-cr,
169
- var(--_ctm-tab-dn-pr-tt-cr, var(--_ctm-dn-pr-tt-cr))
170
- );
171
- font-family: var(
172
- --_ctm-mob-dn-pr-tt-ft-fy,
173
- var(--_ctm-tab-dn-pr-tt-ft-fy, var(--_ctm-dn-pr-tt-ft-fy))
174
- );
175
- font-size: var(
176
- --_ctm-mob-dn-pr-tt-ft-se,
177
- var(--_ctm-tab-dn-pr-tt-ft-se, var(--_ctm-dn-pr-tt-ft-se))
178
- );
179
- font-weight: var(
180
- --_ctm-mob-dn-pr-tt-ft-wt,
181
- var(--_ctm-tab-dn-pr-tt-ft-wt, var(--_ctm-dn-pr-tt-ft-wt))
182
- );
183
- font-style: var(
184
- --_ctm-mob-dn-pr-tt-ft-se-ic,
185
- var(--_ctm-tab-dn-pr-tt-ft-se-ic, var(--_ctm-dn-pr-tt-ft-se-ic))
186
- );
187
- text-align: var(
188
- --_ctm-mob-dn-pr-tt-tt-an,
189
- var(--_ctm-tab-dn-pr-tt-tt-an, var(--_ctm-dn-pr-tt-tt-an))
190
- );
191
- letter-spacing: var(
192
- --_ctm-mob-dn-pr-tt-lr-sg,
193
- var(--_ctm-tab-dn-pr-tt-lr-sg, var(--_ctm-dn-pr-tt-lr-sg))
194
- );
195
- line-height: var(
196
- --_ctm-mob-dn-pr-tt-le-ht,
197
- var(--_ctm-tab-dn-pr-tt-le-ht, var(--_ctm-dn-pr-tt-le-ht))
198
- );
199
- text-decoration: var(
200
- --_ctm-mob-dn-pr-tt-ue,
201
- var(--_ctm-tab-dn-pr-tt-ue, var(--_ctm-dn-pr-tt-ue))
202
- );
203
- }
204
- }
205
-
206
- .search-button {
207
- color: #fff;
208
- border: none;
209
- padding-left: 10px;
210
- border-radius: 4px;
211
- // cursor: pointer;
212
- transition: 0.3s;
213
- svg {
214
- width: var(
215
- --_ctm-mob-dn-sh-in-in-se,
216
- var(--_ctm-tab-dn-sh-in-in-se, var(--_ctm-dn-sh-in-in-se))
217
- );
218
- height: var(
219
- --_ctm-mob-dn-sh-in-in-se,
220
- var(--_ctm-tab-dn-sh-in-in-se, var(--_ctm-dn-sh-in-in-se))
221
- );
222
-
223
- path {
224
- stroke: var(
225
- --_ctm-mob-dn-sh-in-in-c1,
226
- var(--_ctm-tab-dn-sh-in-in-c1, var(--_ctm-dn-sh-in-in-c1))
227
- );
228
- }
229
- }
230
-
231
- // &:hover {
232
- // background: #0056b3;
233
- // }
234
- }
235
- }
236
-
237
- .confirm__btn {
238
- cursor: pointer;
239
- display: flex;
240
- justify-content: center;
241
- align-items: center;
242
- padding: 8px;
243
- gap: 8px;
244
- width: 100%;
245
- height: 100%;
246
-
247
- background-color: var(
248
- --_ctm-mob-dn-vw-os-bn-dt-se-bd-cr,
249
- var(--_ctm-tab-dn-vw-os-bn-dt-se-bd-cr, var(--_ctm-dn-vw-os-bn-dt-se-bd-cr))
250
- );
251
- color: var(
252
- --_ctm-mob-dn-vw-os-bn-dt-se-cr,
253
- var(--_ctm-tab-dn-vw-os-bn-dt-se-cr, var(--_ctm-dn-vw-os-bn-dt-se-cr))
254
- );
255
-
256
- border-color: var(
257
- --_show-border-im-se,
258
- var(
259
- --_ctm-mob-dn-vw-os-bn-dt-se-br-cr,
260
- var(--_ctm-tab-dn-vw-os-bn-dt-se-br-cr, var(--_ctm-dn-vw-os-bn-dt-se-br-cr))
261
- )
262
- );
263
- border-style: var(
264
- --_show-border-im-se,
265
- var(
266
- --_ctm-mob-dn-vw-os-bn-dt-se-br-se,
267
- var(--_ctm-tab-dn-vw-os-bn-dt-se-br-se, var(--_ctm-dn-vw-os-bn-dt-se-br-se))
268
- )
269
- );
270
- border-width: var(
271
- --_show-border-im-se,
272
- var(
273
- --_ctm-mob-dn-vw-os-bn-dt-se-br-wh,
274
- var(--_ctm-tab-dn-vw-os-bn-dt-se-br-wh, var(--_ctm-dn-vw-os-bn-dt-se-br-wh))
275
- )
276
- );
277
- border-radius: var(
278
- --_ctm-mob-dn-vw-os-bn-dt-se-br-rs,
279
- var(--_ctm-tab-dn-vw-os-bn-dt-se-br-rs, var(--_ctm-dn-vw-os-bn-dt-se-br-rs))
280
- );
281
-
282
- box-shadow: var(
283
- --_show-shadow-im-se,
284
- var(
285
- --_ctm-mob-dn-vw-os-bn-dt-se-sw-ae,
286
- var(--_ctm-tab-dn-vw-os-bn-dt-se-sw-ae, var(--_ctm-dn-vw-os-bn-dt-se-sw-ae))
287
- )
288
- var(
289
- --_ctm-mob-dn-vw-os-bn-dt-se-sw-br,
290
- var(--_ctm-tab-dn-vw-os-bn-dt-se-sw-br, var(--_ctm-dn-vw-os-bn-dt-se-sw-br))
291
- )
292
- var(
293
- --_ctm-mob-dn-vw-os-bn-dt-se-sw-sd,
294
- var(--_ctm-tab-dn-vw-os-bn-dt-se-sw-sd, var(--_ctm-dn-vw-os-bn-dt-se-sw-sd))
295
- )
296
- var(
297
- --_ctm-mob-dn-vw-os-bn-dt-se-sw-cr,
298
- var(--_ctm-tab-dn-vw-os-bn-dt-se-sw-cr, var(--_ctm-dn-vw-os-bn-dt-se-sw-cr))
299
- )
300
- );
301
-
302
- font-family: var(
303
- --_ctm-mob-dn-vw-os-bn-dt-se-ft-fy,
304
- var(--_ctm-tab-dn-vw-os-bn-dt-se-ft-fy, var(--_ctm-dn-vw-os-bn-dt-se-ft-fy))
305
- );
306
- font-size: var(
307
- --_ctm-mob-dn-vw-os-bn-dt-se-ft-se,
308
- var(--_ctm-tab-dn-vw-os-bn-dt-se-ft-se, var(--_ctm-dn-vw-os-bn-dt-se-ft-se))
309
- );
310
- font-weight: var(
311
- --_ctm-mob-dn-vw-os-bn-dt-se-ft-wt,
312
- var(--_ctm-tab-dn-vw-os-bn-dt-se-ft-wt, var(--_ctm-dn-vw-os-bn-dt-se-ft-wt))
313
- );
314
- font-style: var(
315
- --_ctm-mob-dn-vw-os-bn-dt-se-ft-se-ic,
316
- var(--_ctm-tab-dn-vw-os-bn-dt-se-ft-se-ic, var(--_ctm-dn-vw-os-bn-dt-se-ft-se-ic))
317
- );
318
- text-align: var(
319
- --_ctm-mob-dn-vw-os-bn-dt-se-tt-an,
320
- var(--_ctm-tab-dn-vw-os-bn-dt-se-tt-an, var(--_ctm-dn-vw-os-bn-dt-se-tt-an))
321
- );
322
- letter-spacing: var(
323
- --_ctm-mob-dn-vw-os-bn-dt-se-lr-sg,
324
- var(--_ctm-tab-dn-vw-os-bn-dt-se-lr-sg, var(--_ctm-dn-vw-os-bn-dt-se-lr-sg))
325
- );
326
- line-height: var(
327
- --_ctm-mob-dn-vw-os-bn-dt-se-le-ht,
328
- var(--_ctm-tab-dn-vw-os-bn-dt-se-le-ht, var(--_ctm-dn-vw-os-bn-dt-se-le-ht))
329
- );
330
- text-decoration: var(
331
- --_ctm-mob-dn-vw-os-bn-dt-se-ue,
332
- var(--_ctm-tab-dn-vw-os-bn-dt-se-ue, var(--_ctm-dn-vw-os-bn-dt-se-ue))
333
- );
334
-
335
- svg {
336
- width: var(
337
- --_ctm-mob-dn-vw-os-bn-dt-se-in-se,
338
- var(--_ctm-tab-dn-vw-os-bn-dt-se-in-se, var(--_ctm-dn-vw-os-bn-dt-se-in-se))
339
- );
340
- height: var(
341
- --_ctm-mob-dn-vw-os-bn-dt-se-in-se,
342
- var(--_ctm-tab-dn-vw-os-bn-dt-se-in-se, var(--_ctm-dn-vw-os-bn-dt-se-in-se))
343
- );
344
- path {
345
- stroke: var(
346
- --_ctm-mob-dn-vw-os-bn-dt-se-in-c1,
347
- var(--_ctm-tab-dn-vw-os-bn-dt-se-in-c1, var(--_ctm-dn-vw-os-bn-dt-se-in-c1))
348
- );
349
- }
350
- }
351
- &:hover {
352
- background-color: var(
353
- --_ctm-mob-dn-vw-os-bn-hr-se-bd-cr,
354
- var(--_ctm-tab-dn-vw-os-bn-hr-se-bd-cr, var(--_ctm-dn-vw-os-bn-hr-se-bd-cr))
355
- );
356
-
357
- border-color: var(
358
- --_show-border-im-se,
359
- var(
360
- --_ctm-mob-dn-vw-os-bn-hr-se-br-cr,
361
- var(--_ctm-tab-dn-vw-os-bn-hr-se-br-cr, var(--_ctm-dn-vw-os-bn-hr-se-br-cr))
362
- )
363
- );
364
- border-style: var(
365
- --_show-border-im-se,
366
- var(
367
- --_ctm-mob-dn-vw-os-bn-hr-se-br-se,
368
- var(--_ctm-tab-dn-vw-os-bn-hr-se-br-se, var(--_ctm-dn-vw-os-bn-hr-se-br-se))
369
- )
370
- );
371
- border-width: var(
372
- --_show-border-im-se,
373
- var(
374
- --_ctm-mob-dn-vw-os-bn-hr-se-br-wh,
375
- var(--_ctm-tab-dn-vw-os-bn-hr-se-br-wh, var(--_ctm-dn-vw-os-bn-hr-se-br-wh))
376
- )
377
- );
378
- border-radius: var(
379
- --_ctm-mob-dn-vw-os-bn-hr-se-br-rs,
380
- var(--_ctm-tab-dn-vw-os-bn-hr-se-br-rs, var(--_ctm-dn-vw-os-bn-hr-se-br-rs))
381
- );
382
-
383
- box-shadow: var(
384
- --_show-shadow-im-se,
385
- var(
386
- --_ctm-mob-dn-vw-os-bn-hr-se-sw-ae,
387
- var(--_ctm-tab-dn-vw-os-bn-hr-se-sw-ae, var(--_ctm-dn-vw-os-bn-hr-se-sw-ae))
388
- )
389
- var(
390
- --_ctm-mob-dn-vw-os-bn-hr-se-sw-br,
391
- var(--_ctm-tab-dn-vw-os-bn-hr-se-sw-br, var(--_ctm-dn-vw-os-bn-hr-se-sw-br))
392
- )
393
- var(
394
- --_ctm-mob-dn-vw-os-bn-hr-se-sw-sd,
395
- var(--_ctm-tab-dn-vw-os-bn-hr-se-sw-sd, var(--_ctm-dn-vw-os-bn-hr-se-sw-sd))
396
- )
397
- var(
398
- --_ctm-mob-dn-vw-os-bn-hr-se-sw-cr,
399
- var(--_ctm-tab-dn-vw-os-bn-hr-se-sw-cr, var(--_ctm-dn-vw-os-bn-hr-se-sw-cr))
400
- )
401
- );
402
-
403
- color: var(
404
- --_ctm-mob-dn-vw-os-bn-hr-se-cr,
405
- var(--_ctm-tab-dn-vw-os-bn-hr-se-cr, var(--_ctm-dn-vw-os-bn-hr-se-cr))
406
- );
407
-
408
- font-family: var(
409
- --_ctm-mob-dn-vw-os-bn-hr-se-ft-fy,
410
- var(--_ctm-tab-dn-vw-os-bn-hr-se-ft-fy, var(--_ctm-dn-vw-os-bn-hr-se-ft-fy))
411
- );
412
-
413
- font-size: var(
414
- --_ctm-mob-dn-vw-os-bn-hr-se-ft-se,
415
- var(--_ctm-tab-dn-vw-os-bn-hr-se-ft-se, var(--_ctm-dn-vw-os-bn-hr-se-ft-se))
416
- );
417
-
418
- font-weight: var(
419
- --_ctm-mob-dn-vw-os-bn-hr-se-ft-wt,
420
- var(--_ctm-tab-dn-vw-os-bn-hr-se-ft-wt, var(--_ctm-dn-vw-os-bn-hr-se-ft-wt))
421
- );
422
-
423
- font-style: var(
424
- --_ctm-mob-dn-vw-os-bn-hr-se-ft-se-ic,
425
- var(--_ctm-tab-dn-vw-os-bn-hr-se-ft-se-ic, var(--_ctm-dn-vw-os-bn-hr-se-ft-se-ic))
426
- );
427
-
428
- text-align: var(
429
- --_ctm-mob-dn-vw-os-bn-hr-se-tt-an,
430
- var(--_ctm-tab-dn-vw-os-bn-hr-se-tt-an, var(--_ctm-dn-vw-os-bn-hr-se-tt-an))
431
- );
432
-
433
- letter-spacing: var(
434
- --_ctm-mob-dn-vw-os-bn-hr-se-lr-sg,
435
- var(--_ctm-tab-dn-vw-os-bn-hr-se-lr-sg, var(--_ctm-dn-vw-os-bn-hr-se-lr-sg))
436
- );
437
-
438
- line-height: var(
439
- --_ctm-mob-dn-vw-os-bn-hr-se-le-ht,
440
- var(--_ctm-tab-dn-vw-os-bn-hr-se-le-ht, var(--_ctm-dn-vw-os-bn-hr-se-le-ht))
441
- );
442
-
443
- text-decoration: var(
444
- --_ctm-mob-dn-vw-os-bn-hr-se-ue,
445
- var(--_ctm-tab-dn-vw-os-bn-hr-se-ue, var(--_ctm-dn-vw-os-bn-hr-se-ue))
446
- );
447
-
448
- svg {
449
- width: var(
450
- --_ctm-mob-dn-vw-os-bn-hr-se-in-se,
451
- var(--_ctm-tab-dn-vw-os-bn-hr-se-in-se, var(--_ctm-dn-vw-os-bn-hr-se-in-se))
452
- );
453
- height: var(
454
- --_ctm-mob-dn-vw-os-bn-hr-se-in-se,
455
- var(--_ctm-tab-dn-vw-os-bn-hr-se-in-se, var(--_ctm-dn-vw-os-bn-hr-se-in-se))
456
- );
457
- path {
458
- stroke: var(
459
- --_ctm-mob-dn-vw-os-bn-hr-se-in-c1,
460
- var(--_ctm-tab-dn-vw-os-bn-hr-se-in-c1, var(--_ctm-dn-vw-os-bn-hr-se-in-c1))
461
- );
462
- }
463
- }
464
- }
465
- }
466
- }
467
- .button__container {
468
- background-color: var(--_gray-50);
469
- .title {
470
- font-size: 16px;
471
- font-weight: 600;
472
- color: #475467;
473
- padding: 20px 0px 6px 0px;
474
- background-color: #fff;
475
- }
476
-
477
- .form__container {
478
- padding: 16px;
479
- .form__header {
480
- display: flex;
481
- justify-content: space-between;
482
- align-items: center;
483
- cursor: pointer;
484
- font-weight: 600;
485
- color: var(--_primary-400);
486
- color: var(
487
- --_ctm-mob-dn-wt-tt-ss-cr,
488
- var(--_ctm-tab-dn-wt-tt-ss-cr, var(--_ctm-dn-wt-tt-ss-cr))
489
- );
490
-
491
- font-family: var(
492
- --_ctm-mob-dn-wt-tt-ss-ft-fy,
493
- var(--_ctm-tab-dn-wt-tt-ss-ft-fy, var(--_ctm-dn-wt-tt-ss-ft-fy))
494
- );
495
-
496
- font-size: var(
497
- --_ctm-mob-dn-wt-tt-ss-ft-se,
498
- var(--_ctm-tab-dn-wt-tt-ss-ft-se, var(--_ctm-dn-wt-tt-ss-ft-se))
499
- );
500
-
501
- font-weight: var(
502
- --_ctm-mob-dn-wt-tt-ss-ft-wt,
503
- var(--_ctm-tab-dn-wt-tt-ss-ft-wt, var(--_ctm-dn-wt-tt-ss-ft-wt))
504
- );
505
-
506
- font-style: var(
507
- --_ctm-mob-dn-wt-tt-ss-ft-se-ic,
508
- var(--_ctm-tab-dn-wt-tt-ss-ft-se-ic, var(--_ctm-dn-wt-tt-ss-ft-se-ic))
509
- );
510
-
511
- text-align: var(
512
- --_ctm-mob-dn-wt-tt-ss-tt-an,
513
- var(--_ctm-tab-dn-wt-tt-ss-tt-an, var(--_ctm-dn-wt-tt-ss-tt-an))
514
- );
515
-
516
- letter-spacing: var(
517
- --_ctm-mob-dn-wt-tt-ss-lr-sg,
518
- var(--_ctm-tab-dn-wt-tt-ss-lr-sg, var(--_ctm-dn-wt-tt-ss-lr-sg))
519
- );
520
-
521
- line-height: var(
522
- --_ctm-mob-dn-wt-tt-ss-le-ht,
523
- var(--_ctm-tab-dn-wt-tt-ss-le-ht, var(--_ctm-dn-wt-tt-ss-le-ht))
524
- );
525
-
526
- text-decoration: var(
527
- --_ctm-mob-dn-wt-tt-ss-ue,
528
- var(--_ctm-tab-dn-wt-tt-ss-ue, var(--_ctm-dn-wt-tt-ss-ue))
529
- );
530
-
531
- button {
532
- svg {
533
- path {
534
- stroke: var(--_primary-400);
535
- }
536
- }
537
- }
538
- }
539
- .form__title {
540
- margin-top: 12px;
541
-
542
- color: var(
543
- --_ctm-mob-dn-wt-tt-ss-cr-dc,
544
- var(--_ctm-tab-dn-wt-tt-ss-cr-dc, var(--_ctm-dn-wt-tt-ss-cr-dc))
545
- );
546
-
547
- font-family: var(
548
- --_ctm-mob-dn-wt-tt-ss-ft-fy-dc,
549
- var(--_ctm-tab-dn-wt-tt-ss-ft-fy-dc, var(--_ctm-dn-wt-tt-ss-ft-fy-dc))
550
- );
551
-
552
- font-size: var(
553
- --_ctm-mob-dn-wt-tt-ss-ft-se-dc,
554
- var(--_ctm-tab-dn-wt-tt-ss-ft-se-dc, var(--_ctm-dn-wt-tt-ss-ft-se-dc))
555
- );
556
-
557
- font-weight: var(
558
- --_ctm-mob-dn-wt-tt-ss-ft-wt-dc,
559
- var(--_ctm-tab-dn-wt-tt-ss-ft-wt-dc, var(--_ctm-dn-wt-tt-ss-ft-wt-dc))
560
- );
561
-
562
- font-style: var(
563
- --_ctm-mob-dn-wt-tt-ss-ft-se-ic-dc,
564
- var(--_ctm-tab-dn-wt-tt-ss-ft-se-ic-dc, var(--_ctm-dn-wt-tt-ss-ft-se-ic-dc))
565
- );
566
-
567
- text-align: var(
568
- --_ctm-mob-dn-wt-tt-ss-tt-an-dc,
569
- var(--_ctm-tab-dn-wt-tt-ss-tt-an-dc, var(--_ctm-dn-wt-tt-ss-tt-an-dc))
570
- );
571
-
572
- letter-spacing: var(
573
- --_ctm-mob-dn-wt-tt-ss-lr-sg-dc,
574
- var(--_ctm-tab-dn-wt-tt-ss-lr-sg-dc, var(--_ctm-dn-wt-tt-ss-lr-sg-dc))
575
- );
576
-
577
- line-height: var(
578
- --_ctm-mob-dn-wt-tt-ss-le-ht-dc,
579
- var(--_ctm-tab-dn-wt-tt-ss-le-ht-dc, var(--_ctm-dn-wt-tt-ss-le-ht-dc))
580
- );
581
-
582
- text-decoration: var(
583
- --_ctm-mob-dn-wt-tt-ss-ue-dc,
584
- var(--_ctm-tab-dn-wt-tt-ss-ue-dc, var(--_ctm-dn-wt-tt-ss-ue-dc))
585
- );
586
- }
587
- .est__dropdown {
588
- & > button {
589
- width: 100%;
590
- & > span:last-child {
591
- position: absolute;
592
- top: 30;
593
- right: 8;
594
- }
595
- }
596
- }
597
- .input__div {
598
- margin-top: 10px;
599
- display: flex;
600
- flex-direction: column;
601
- gap: 6px;
602
- label {
603
- font-size: 14px;
604
- color: var(--_gray-700);
605
- margin-bottom: 8px;
606
- display: block;
607
- }
608
-
609
- input {
610
- width: 100%;
611
- padding: 6px 5px;
612
- border: 1px solid var(--_gray-400);
613
- border-radius: 6px;
614
- font-size: 1rem;
615
- font-family: inherit;
616
- transition:
617
- border-color 0.2s ease,
618
- box-shadow 0.2s ease;
619
- }
620
-
621
- // input:focus {
622
- // border-color: #4f46e5; /* Indigo */
623
- // box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.2);
624
- // outline: none;
625
- // }
626
- .error__message {
627
- color: red;
628
- font-size: 12px;
629
- }
630
- }
631
- }
632
- .payment__methods {
633
- &:has(.stack__vertical) {
634
- .content__title {
635
- border-bottom: 1px solid var(--_gray-300);
636
- }
637
- }
638
- .shippng__title {
639
- margin: 16px;
640
- padding-bottom: 10px;
641
- margin-bottom: 0px;
642
- color: var(
643
- --_ctm-mob-dn-sg-ne-cr,
644
- var(--_ctm-tab-dn-sg-ne-cr, var(--_ctm-dn-sg-ne-cr))
645
- );
646
- font-family: var(
647
- --_ctm-mob-dn-sg-ne-ft-fy,
648
- var(--_ctm-tab-dn-sg-ne-ft-fy, var(--_ctm-dn-sg-ne-ft-fy))
649
- );
650
- font-size: var(
651
- --_ctm-mob-dn-sg-ne-ft-se,
652
- var(--_ctm-tab-dn-sg-ne-ft-se, var(--_ctm-dn-sg-ne-ft-se))
653
- );
654
- font-weight: var(
655
- --_ctm-mob-dn-sg-ne-ft-wt,
656
- var(--_ctm-tab-dn-sg-ne-ft-wt, var(--_ctm-dn-sg-ne-ft-wt))
657
- );
658
- font-style: var(
659
- --_ctm-mob-dn-it-se-ft-se-ic,
660
- var(--_ctm-tab-dn-it-se-ft-se-ic, var(--_ctm-dn-it-se-ft-se-ic))
661
- );
662
- text-align: var(
663
- --_ctm-mob-dn-sg-ne-tt-an,
664
- var(--_ctm-tab-dn-sg-ne-tt-an, var(--_ctm-dn-sg-ne-tt-an))
665
- );
666
- letter-spacing: var(
667
- --_ctm-mob-dn-it-se-lr-sg,
668
- var(--_ctm-tab-dn-it-se-lr-sg, var(--_ctm-dn-it-se-lr-sg))
669
- );
670
- line-height: var(
671
- --_ctm-mob-dn-sg-ne-le-ht,
672
- var(--_ctm-tab-dn-sg-ne-le-ht, var(--_ctm-dn-sg-ne-le-ht))
673
- );
674
- text-decoration: var(
675
- --_ctm-mob-dn-wt-tt-ss-ue-dc,
676
- var(--_ctm-tab-dn-wt-tt-ss-ue-dc, var(--_ctm-dn-wt-tt-ss-ue-dc))
677
- );
678
- }
679
-
680
- .stack {
681
- display: grid;
682
- background-color: #fff;
683
- &.stack__vertical {
684
- grid-template-columns: repeat(auto-fit, minmax(100%, 1fr));
685
- gap: var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg)));
686
- // max-height: var(--_sf-custom-height);
687
- // overflow-y: auto;
688
- max-height: var(--_sf-custom-height);
689
- overflow-y: hidden;
690
-
691
- &[data-add-scroll="true"] {
692
- overflow-y: auto;
693
- }
694
- }
695
- &.stack__horizontal {
696
- // grid-template-columns: repeat(auto-fit, minmax(48%, 1fr));
697
- display: flex;
698
- gap: var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg)));
699
- // padding: var(--_ctm-mob-lt-im-pg, var(--_ctm-tab-lt-im-pg, var(--_ctm-lt-im-pg)));
700
- width: 100%;
701
- background-color: #fff;
702
-
703
- &[data-overflow="Wrap"] {
704
- flex-wrap: wrap;
705
- }
706
- &[data-overflow="Scroll"] {
707
- overflow-x: auto;
708
- }
709
- .item {
710
- flex-wrap: nowrap;
711
- }
712
- }
713
- &.grid {
714
- display: grid;
715
- grid-template-columns: repeat(
716
- var(--_ctm-mob-lt-is-pr-rw, var(--_ctm-tab-lt-is-pr-rw, var(--_ctm-lt-is-pr-rw))),
717
- minmax(auto, 1fr)
718
- );
719
- gap: var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg)));
720
- // padding: var(--_ctm-mob-lt-im-pg, var(--_ctm-tab-lt-im-pg, var(--_ctm-lt-im-pg)));
721
- max-height: var(--_sf-custom-height);
722
- overflow-y: hidden;
723
-
724
- &[data-add-scroll="true"] {
725
- overflow-y: auto;
726
- }
727
- }
728
- .item {
729
- display: flex;
730
- // justify-content: space-between;
731
- gap: 20px;
732
- align-items: center;
733
- cursor: pointer;
734
- background-color: var(--_primary-25);
735
- flex-wrap: wrap;
736
-
737
- height: var(--_ctm-mob-lt-im-ht, var(--_ctm-tab-lt-im-ht, var(--_ctm-lt-im-ht)));
738
-
739
- // padding: var(
740
- // --_ctm-mob-dn-im-se-vl-pg,
741
- // var(--_ctm-tab-dn-im-se-vl-pg, var(--_ctm-dn-im-se-vl-pg))
742
- // )
743
- // var(
744
- // --_ctm-mob-dn-im-se-hl-pg,
745
- // var(--_ctm-tab-dn-im-se-hl-pg, var(--_ctm-dn-im-se-hl-pg))
746
- // );
747
-
748
- padding: var(--_ctm-mob-lt-im-pg, var(--_ctm-tab-lt-im-pg, var(--_ctm-lt-im-pg)));
749
-
750
- background-color: var(
751
- --_ctm-mob-dn-im-se-bd-cr,
752
- var(--_ctm-tab-dn-im-se-bd-cr, var(--_ctm-dn-im-se-bd-cr))
753
- );
754
-
755
- border-color: var(
756
- --_show-border-im-se,
757
- var(
758
- --_ctm-mob-dn-im-se-br-cr,
759
- var(--_ctm-tab-dn-im-se-br-cr, var(--_ctm-dn-im-se-br-cr))
760
- )
761
- );
762
- border-style: var(
763
- --_show-border-im-se,
764
- var(
765
- --_ctm-mob-dn-im-se-br-se,
766
- var(--_ctm-tab-dn-im-se-br-se, var(--_ctm-dn-im-se-br-se))
767
- )
768
- );
769
- border-width: var(
770
- --_show-border-im-se,
771
- var(
772
- --_ctm-mob-dn-im-se-br-wh,
773
- var(--_ctm-tab-dn-im-se-br-wh, var(--_ctm-dn-im-se-br-wh))
774
- )
775
- );
776
- border-radius: var(
777
- --_ctm-mob-dn-im-se-br-rs,
778
- var(--_ctm-tab-dn-im-se-br-rs, var(--_ctm-dn-im-se-br-rs))
779
- );
780
-
781
- box-shadow: var(
782
- --_show-shadow-im-se,
783
- var(
784
- --_ctm-mob-dn-im-se-sw-ae,
785
- var(--_ctm-tab-dn-im-se-sw-ae, var(--_ctm-dn-im-se-sw-ae))
786
- )
787
- var(
788
- --_ctm-mob-dn-im-se-sw-br,
789
- var(--_ctm-tab-dn-im-se-sw-br, var(--_ctm-dn-im-se-sw-br))
790
- )
791
- var(
792
- --_ctm-mob-dn-im-se-sw-sd,
793
- var(--_ctm-tab-dn-im-se-sw-sd, var(--_ctm-dn-im-se-sw-sd))
794
- )
795
- var(
796
- --_ctm-mob-dn-im-se-sw-cr,
797
- var(--_ctm-tab-dn-im-se-sw-cr, var(--_ctm-dn-im-se-sw-cr))
798
- )
799
- );
800
- // .left__col {
801
- // display: inline-block;
802
- // font-weight: 600;
803
- // input[type="radio"] {
804
- // width: auto;
805
- // display: inline-block;
806
- // margin-right: 10px;
807
- // }
808
- // }
809
-
810
- // .right__col {
811
- // display: flex;
812
- // align-items: center;
813
- // text-align: center;
814
- // gap: 16px;
815
- // font-weight: 500;
816
- // flex-wrap: wrap;
817
- // justify-content: var(
818
- // --_ctm-mob-dn-im-se-ct-at,
819
- // var(--_ctm-tab-dn-im-se-ct-at, var(--_ctm-dn-im-se-ct-at))
820
- // );
821
-
822
- // span {
823
- // line-height: 12px;
824
- // }
825
-
826
- // .card {
827
- // width: 60px;
828
- // height: 50px;
829
- // background-color: var(
830
- // --_ctm-mob-dn-sg-md-lo-bd-cr,
831
- // var(--_ctm-tab-dn-sg-md-lo-bd-cr, var(--_ctm-dn-sg-md-lo-bd-cr))
832
- // );
833
- // border-color: var(
834
- // --_ctm-mob-dn-sg-md-lo-br-cr,
835
- // var(--_ctm-tab-dn-sg-md-lo-br-cr, var(--_ctm-dn-sg-md-lo-br-cr))
836
- // );
837
- // border-style: var(
838
- // --_ctm-mob-dn-sg-md-lo-br-se,
839
- // var(--_ctm-tab-dn-sg-md-lo-br-se, var(--_ctm-dn-sg-md-lo-br-se))
840
- // );
841
- // border-width: var(
842
- // --_ctm-mob-dn-sg-md-lo-br-wh,
843
- // var(--_ctm-tab-dn-sg-md-lo-br-wh, var(--_ctm-dn-sg-md-lo-br-wh))
844
- // );
845
- // border-radius: var(
846
- // --_ctm-mob-dn-sg-md-lo-br-rs,
847
- // var(--_ctm-tab-dn-sg-md-lo-br-rs, var(--_ctm-dn-sg-md-lo-br-rs))
848
- // );
849
- // box-shadow: var(
850
- // var(
851
- // --_ctm-mob-dn-sg-md-lo-sw-ae,
852
- // var(
853
- // --_ctm-tab-dn-sg-md-lo-sw-ae,
854
- // var(--_ctm-dn-sg-md-lo-sw-ae, var(--_tst-dn-sw-ae))
855
- // )
856
- // )
857
- // var(
858
- // --_ctm-mob-dn-sg-md-lo-sw-br,
859
- // var(
860
- // --_ctm-tab-dn-sg-md-lo-sw-br,
861
- // var(--_ctm-dn-sg-md-lo-sw-br, var(--_tst-dn-sw-br))
862
- // )
863
- // )
864
- // var(
865
- // --_ctm-mob-dn-sg-md-lo-sw-sd,
866
- // var(
867
- // --_ctm-tab-dn-sg-md-lo-sw-sd,
868
- // var(--_ctm-dn-sg-md-lo-sw-sd, var(--_tst-dn-sw-sd))
869
- // )
870
- // )
871
- // var(
872
- // --_ctm-mob-dn-sg-md-lo-sw-cr,
873
- // var(
874
- // --_ctm-tab-dn-sg-md-lo-sw-cr,
875
- // var(--_ctm-dn-sg-md-lo-sw-cr, var(--_tst-dn-sw-cr))
876
- // )
877
- // )
878
- // );
879
- // & > img {
880
- // width: 100%;
881
- // height: 100%;
882
- // }
883
- // }
884
- // }
885
- p {
886
- white-space: nowrap;
887
- }
888
- }
889
- }
890
- .stack__table {
891
- width: 100%;
892
- border-collapse: collapse;
893
- border-radius: 6px;
894
- background-color: var(
895
- --_ctm-mob-dn-te-bd-cr,
896
- var(--_ctm-tab-dn-te-bd-cr, var(--_ctm-dn-te-bd-cr))
897
- );
898
- border-color: var(
899
- --_show-border-im-se,
900
- var(--_ctm-mob-dn-te-br-cr, var(--_ctm-tab-dn-te-br-cr, var(--_ctm-dn-te-br-cr)))
901
- );
902
- border-style: var(
903
- --_show-border-im-se,
904
- var(--_ctm-mob-dn-te-br-se, var(--_ctm-tab-dn-te-br-se, var(--_ctm-dn-te-br-se)))
905
- );
906
- border-width: var(
907
- --_show-border-im-se,
908
- var(--_ctm-mob-dn-te-br-wh, var(--_ctm-tab-dn-te-br-wh, var(--_ctm-dn-te-br-wh)))
909
- );
910
- border-radius: var(
911
- --_ctm-mob-dn-te-br-rs,
912
- var(--_ctm-tab-dn-te-br-rs, var(--_ctm-dn-te-br-rs))
913
- );
914
- box-shadow: var(
915
- --_show-shadow-im-se,
916
- var(--_ctm-mob-dn-te-sw-ae, var(--_ctm-tab-dn-te-sw-ae, var(--_ctm-dn-te-sw-ae)))
917
- var(--_ctm-mob-dn-te-sw-br, var(--_ctm-tab-dn-te-sw-br, var(--_ctm-dn-te-sw-br)))
918
- var(--_ctm-mob-dn-te-sw-sd, var(--_ctm-tab-dn-te-sw-sd, var(--_ctm-dn-te-sw-sd)))
919
- var(--_ctm-mob-dn-te-sw-cr, var(--_ctm-tab-dn-te-sw-cr, var(--_ctm-dn-te-sw-cr)))
920
- );
921
- &[data-header-divider="true"] {
922
- thead tr th {
923
- border-bottom: 1px solid
924
- var(
925
- --_ctm-mob-dn-rw-ds-hr-dr,
926
- var(--_ctm-tab-dn-rw-ds-hr-dr, var(--_ctm-dn-rw-ds-hr-dr))
927
- );
928
- }
929
- }
930
- &[data-row-divider="true"] {
931
- tbody tr td {
932
- border-bottom: 1px solid
933
- var(
934
- --_ctm-mob-dn-rw-ds-rw-dr,
935
- var(--_ctm-tab-dn-rw-ds-rw-dr, var(--_ctm-dn-rw-ds-rw-dr))
936
- );
937
- }
938
- }
939
- &[data-column-divider="true"] {
940
- tbody tr td,
941
- thead tr th {
942
- border-right: 1px solid
943
- var(
944
- --_ctm-mob-dn-rw-ds-cn-dr,
945
- var(--_ctm-tab-dn-rw-ds-cn-dr, var(--_ctm-dn-rw-ds-cn-dr))
946
- );
947
- }
948
-
949
- tbody tr td:last-child,
950
- thead tr th:last-child {
951
- border-right: none;
952
- }
953
- }
954
- &[data-alternative-row-colors="true"] {
955
- tbody tr:nth-child(odd) {
956
- background-color: var(--_gray-300);
957
- width: 100%;
958
- }
959
- }
960
- thead {
961
- height: var(--_ctm-mob-lt-hr-ht, var(--_ctm-tab-lt-hr-ht, var(--_ctm-dn-lt-hr-ht)));
962
- tr {
963
- th {
964
- padding: var(
965
- --_ctm-mob-lt-hr-cl-pg,
966
- var(--_ctm-tab-lt-hr-cl-pg, var(--_ctm-dn-lt-hr-cl-pg))
967
- );
968
- text-align: var(
969
- --_ctm-mob-lt-ct-at,
970
- var(--_ctm-tab-lt-ct-at, var(--_ctm-dn-lt-ct-at))
971
- );
972
- border: 0;
973
- background-color: var(
974
- --_ctm-mob-dn-te-hr-bd-cr,
975
- var(--_ctm-tab-dn-te-hr-bd-cr, var(--_ctm-dn-te-hr-bd-cr))
976
- );
977
- color: var(
978
- --_ctm-mob-dn-hr-tt-cr,
979
- var(--_ctm-tab-dn-hr-tt-cr, var(--_ctm-dn-hr-tt-cr))
980
- );
981
- font-family: var(
982
- --_ctm-mob-dn-hr-tt-ft-fy,
983
- var(--_ctm-tab-dn-hr-tt-ft-fy, var(--_ctm-dn-hr-tt-ft-fy))
984
- );
985
- font-size: var(
986
- --_ctm-mob-dn-hr-tt-ft-se,
987
- var(--_ctm-tab-dn-hr-tt-ft-se, var(--_ctm-dn-hr-tt-ft-se))
988
- );
989
- font-weight: var(
990
- --_ctm-mob-dn-hr-tt-ft-wt,
991
- var(--_ctm-tab-dn-hr-tt-ft-wt, var(--_ctm-dn-hr-tt-ft-wt))
992
- );
993
- font-style: var(
994
- --_ctm-mob-dn-hr-tt-ft-se-ic,
995
- var(--_ctm-tab-dn-hr-tt-ft-se-ic, var(--_ctm-dn-hr-tt-ft-se-ic))
996
- );
997
- text-align: var(
998
- --_ctm-mob-dn-hr-tt-tt-an,
999
- var(--_ctm-tab-dn-hr-tt-an, var(--_ctm-dn-hr-tt-an))
1000
- );
1001
- letter-spacing: var(
1002
- --_ctm-mob-dn-hr-tt-lr-sg,
1003
- var(--_ctm-tab-dn-hr-tt-lr-sg, var(--_ctm-dn-hr-tt-lr-sg))
1004
- );
1005
- line-height: var(
1006
- --_ctm-mob-dn-hr-tt-le-ht,
1007
- var(--_ctm-tab-dn-hr-tt-le-ht, var(--_ctm-dn-hr-tt-le-ht))
1008
- );
1009
- text-decoration: var(
1010
- --_ctm-mob-dn-hr-tt-ue,
1011
- var(--_ctm-tab-dn-hr-tt-ue, var(--_ctm-dn-hr-tt-ue))
1012
- );
1013
- }
1014
- }
1015
- }
1016
- tbody {
1017
- tr {
1018
- padding: var(
1019
- --_ctm-mob-lt-rw-cl-pg,
1020
- var(--_ctm-tab-lt-rw-cl-pg, var(--_ctm-dn-lt-rw-cl-pg))
1021
- );
1022
- height: var(
1023
- --_ctm-mob-lt-rw-ht,
1024
- var(--_ctm-tab-lt-rw-ht, var(--_ctm-dn-lt-rw-ht))
1025
- );
1026
- background-color: var(
1027
- --_ctm-mob-dn-te-rw-bd-cr,
1028
- var(--_ctm-tab-dn-te-rw-bd-cr, var(--_ctm-dn-te-rw-bd-cr))
1029
- );
1030
- text-align: var(
1031
- --_ctm-mob-lt-ct-at,
1032
- var(--_ctm-tab-lt-ct-at, var(--_ctm-dn-lt-ct-at))
1033
- );
1034
- th,
1035
- td {
1036
- border: 0;
1037
- padding: inherit;
1038
- color: var(
1039
- --_ctm-mob-dn-te-rw-cr,
1040
- var(--_ctm-tab-dn-te-rw-cr, var(--_ctm-dn-te-rw-cr))
1041
- );
1042
- font-family: var(
1043
- --_ctm-mob-dn-te-rw-ft-fy,
1044
- var(--_ctm-tab-dn-te-rw-ft-fy, var(--_ctm-dn-te-rw-ft-fy))
1045
- );
1046
- font-size: var(
1047
- --_ctm-mob-dn-te-rw-ft-se,
1048
- var(--_ctm-tab-dn-te-rw-ft-se, var(--_ctm-dn-te-rw-ft-se))
1049
- );
1050
- font-weight: var(
1051
- --_ctm-mob-dn-te-rw-ft-wt,
1052
- var(--_ctm-tab-dn-te-rw-ft-wt, var(--_ctm-dn-te-rw-ft-wt))
1053
- );
1054
- font-style: var(
1055
- --_ctm-mob-dn-te-rw-ft-se-ic,
1056
- var(--_ctm-tab-dn-te-rw-ft-se-ic, var(--_ctm-dn-te-rw-ft-se-ic))
1057
- );
1058
- text-align: var(
1059
- --_ctm-mob-dn-te-rw-tt-an,
1060
- var(--_ctm-tab-dn-te-rw-tt-an, var(--_ctm-dn-te-rw-tt-an))
1061
- );
1062
- letter-spacing: var(
1063
- --_ctm-mob-dn-te-rw-lr-sg,
1064
- var(--_ctm-tab-dn-te-rw-lr-sg, var(--_ctm-dn-te-rw-lr-sg))
1065
- );
1066
- line-height: var(
1067
- --_ctm-mob-dn-te-rw-le-ht,
1068
- var(--_ctm-tab-dn-te-rw-le-ht, var(--_ctm-dn-te-rw-le-ht))
1069
- );
1070
- text-decoration: var(
1071
- --_ctm-mob-dn-te-rw-ue,
1072
- var(--_ctm-tab-dn-te-rw-ue, var(--_ctm-dn-te-rw-ue))
1073
- );
1074
- }
1075
- }
1076
- }
1077
- }
1078
- }
1079
- }
1080
- }
1081
- }
1082
- }
1083
- }
1
+ @use "sass:map";
2
+ @use "sass:list";
3
+
4
+ [data-div-type="element"] {
5
+ &[data-element-type="amountEstimator"] {
6
+ // width: var(--_lt-wh);
7
+ // height: var(--_lt-ht);
8
+ // margin: var(--_lt-mn);
9
+ // padding: var(--_lt-pg);
10
+ // width: var(--_ctm-lt-wh, var(--_tst-lt-wh));
11
+ // width: var(--_sf-nw-wh, var(--_tst-lt-wh));
12
+ margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));
13
+ // height: var(--_ctm-lt-ht, var(--_tst-lt-ht));
14
+ // height: ;
15
+ // aspect-ratio: 1 / var(--_sf-aspect-ratio);
16
+ // --_aspect-ratio: calc(
17
+ // 1 * (var(--_ctm-lt-ht, var(--_tst-lt-ht)) / var(--_ctm-lt-wh, var(--_tst-lt-wh)))
18
+ // );
19
+
20
+ & > .wrapper {
21
+ width: 100%;
22
+ // height: 100%;
23
+ }
24
+ &[data-show-shadow="false"] {
25
+ --_show-shadow: none;
26
+ }
27
+ .text-element {
28
+ background: #6d96e4;
29
+ padding: 10px;
30
+ font-weight: 600;
31
+ color: rgba(75, 69, 70, 1);
32
+ }
33
+ .amount__estimator_container {
34
+ background-color: var(
35
+ --_ctm-mob-dn-wt-se-bd-cr,
36
+ var(--_ctm-tab-dn-wt-se-bd-cr, var(--_ctm-dn-wt-se-bd-cr))
37
+ );
38
+ padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
39
+ display: flex;
40
+ flex-direction: column;
41
+ --_sf-gp: var(
42
+ --_ctm-mob-lt-im-sg,
43
+ var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg, var(--_ctm-lt-im-sg), 16px))
44
+ );
45
+ --_sf-cd-gp: calc(var(--_sf-gp) * 0.5);
46
+ row-gap: var(--_sf-gp);
47
+ width: 100%;
48
+ // height: 100%;
49
+ border-color: var(
50
+ --_ctm-mob-dn-wt-se-br-cr,
51
+ var(--_ctm-tab-dn-wt-se-br-cr, var(--_ctm-dn-wt-se-br-cr))
52
+ );
53
+ border-style: var(
54
+ --_ctm-mob-dn-wt-se-br-se,
55
+ var(--_ctm-tab-dn-wt-se-br-se, var(--_ctm-dn-wt-se-br-se))
56
+ );
57
+ border-width: var(
58
+ --_ctm-mob-dn-wt-se-br-wh,
59
+ var(--_ctm-tab-dn-wt-se-br-wh, var(--_ctm-dn-wt-se-br-wh))
60
+ );
61
+ border-radius: var(
62
+ --_ctm-mob-dn-wt-se-br-rs,
63
+ var(--_ctm-tab-dn-wt-se-br-rs, var(--_ctm-dn-wt-se-br-rs))
64
+ );
65
+ box-shadow: var(
66
+ --_show-shadow,
67
+ var(--_ctm-mob-dn-wt-se-sw-ae, var(--_ctm-tab-dn-wt-se-sw-ae, var(--_ctm-dn-wt-se-sw-ae)))
68
+ var(--_ctm-mob-dn-wt-se-sw-br, var(--_ctm-tab-dn-wt-se-sw-br, var(--_ctm-dn-wt-se-sw-br)))
69
+ var(--_ctm-mob-dn-wt-se-sw-sd, var(--_ctm-tab-dn-wt-se-sw-sd, var(--_ctm-dn-wt-se-sw-sd)))
70
+ var(--_ctm-mob-dn-wt-se-sw-cr, var(--_ctm-tab-dn-wt-se-sw-cr, var(--_ctm-dn-wt-se-sw-cr)))
71
+ );
72
+ .button_main {
73
+ border: 1px solid var(--_gray-600);
74
+ width: 100%;
75
+ height: auto;
76
+ overflow-y: auto;
77
+ // padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
78
+ //Input button group
79
+ .input__btn__group {
80
+ display: flex;
81
+ align-items: center;
82
+ gap: 8px;
83
+ color: #fff;
84
+ font-weight: 600;
85
+ font-size: 16px;
86
+ width: 100%;
87
+ border-radius: 6px;
88
+ // & > div {
89
+ // width: 100%;
90
+ // }
91
+
92
+ .search-container {
93
+ width: 100%;
94
+ height: 100%;
95
+ &.dropdown {
96
+ &:focus-within {
97
+ .dropdown__options {
98
+ display: block;
99
+ }
100
+ }
101
+ }
102
+ }
103
+
104
+ .search-wrapper {
105
+ display: flex;
106
+ align-items: center;
107
+ width: 100%;
108
+ height: 100%;
109
+ border: 1px solid var(--_gray-200);
110
+ background-color: var(
111
+ --_ctm-mob-dn-sh-br-bd-cr,
112
+ var(--_ctm-tab-dn-sh-br-bd-cr, var(--_ctm-dn-sh-br-bd-cr))
113
+ );
114
+ border-color: var(
115
+ --_ctm-mob-dn-sh-br-br-cr,
116
+ var(--_ctm-tab-dn-sh-br-br-cr, var(--_ctm-dn-sh-br-br-cr))
117
+ );
118
+ border-style: var(
119
+ --_ctm-mob-dn-sh-br-br-se,
120
+ var(--_ctm-tab-dn-sh-br-br-se, var(--_ctm-dn-sh-br-br-se))
121
+ );
122
+ border-width: var(
123
+ --_ctm-mob-dn-sh-br-br-wh,
124
+ var(--_ctm-tab-dn-sh-br-br-wh, var(--_ctm-dn-sh-br-br-wh))
125
+ );
126
+ box-shadow: var(
127
+ --_show-shadow,
128
+ var(
129
+ --_ctm-mob-dn-sh-br-sw-ae,
130
+ var(--_ctm-tab-dn-sh-br-sw-ae, var(--_ctm-dn-sh-br-sw-ae))
131
+ )
132
+ var(
133
+ --_ctm-mob-dn-sh-br-sw-br,
134
+ var(--_ctm-tab-dn-sh-br-sw-br, var(--_ctm-dn-sh-br-sw-br))
135
+ )
136
+ var(
137
+ --_ctm-mob-dn-sh-br-sw-sd,
138
+ var(--_ctm-tab-dn-sh-br-sw-sd, var(--_ctm-dn-sh-br-sw-sd))
139
+ )
140
+ var(
141
+ --_ctm-mob-dn-sh-br-sw-cr,
142
+ var(--_ctm-tab-dn-sh-br-sw-cr, var(--_ctm-dn-sh-br-sw-cr))
143
+ )
144
+ );
145
+ border-radius: var(
146
+ --_ctm-mob-dn-sh-br-br-rs,
147
+ var(--_ctm-tab-dn-sh-br-br-rs, var(--_ctm-dn-sh-br-br-rs))
148
+ );
149
+
150
+ .search-icon {
151
+ font-size: 18px;
152
+ margin-right: 8px;
153
+ color: #555;
154
+ }
155
+
156
+ .search-input {
157
+ flex-grow: 1;
158
+ border: none;
159
+ outline: none;
160
+ padding: 8px;
161
+ font-size: 14px;
162
+ color: #333;
163
+ background: transparent;
164
+ border-radius: 6px;
165
+
166
+ &::placeholder {
167
+ color: var(
168
+ --_ctm-mob-dn-pr-tt-cr,
169
+ var(--_ctm-tab-dn-pr-tt-cr, var(--_ctm-dn-pr-tt-cr))
170
+ );
171
+ font-family: var(
172
+ --_ctm-mob-dn-pr-tt-ft-fy,
173
+ var(--_ctm-tab-dn-pr-tt-ft-fy, var(--_ctm-dn-pr-tt-ft-fy))
174
+ );
175
+ font-size: var(
176
+ --_ctm-mob-dn-pr-tt-ft-se,
177
+ var(--_ctm-tab-dn-pr-tt-ft-se, var(--_ctm-dn-pr-tt-ft-se))
178
+ );
179
+ font-weight: var(
180
+ --_ctm-mob-dn-pr-tt-ft-wt,
181
+ var(--_ctm-tab-dn-pr-tt-ft-wt, var(--_ctm-dn-pr-tt-ft-wt))
182
+ );
183
+ font-style: var(
184
+ --_ctm-mob-dn-pr-tt-ft-se-ic,
185
+ var(--_ctm-tab-dn-pr-tt-ft-se-ic, var(--_ctm-dn-pr-tt-ft-se-ic))
186
+ );
187
+ text-align: var(
188
+ --_ctm-mob-dn-pr-tt-tt-an,
189
+ var(--_ctm-tab-dn-pr-tt-tt-an, var(--_ctm-dn-pr-tt-tt-an))
190
+ );
191
+ letter-spacing: var(
192
+ --_ctm-mob-dn-pr-tt-lr-sg,
193
+ var(--_ctm-tab-dn-pr-tt-lr-sg, var(--_ctm-dn-pr-tt-lr-sg))
194
+ );
195
+ line-height: var(
196
+ --_ctm-mob-dn-pr-tt-le-ht,
197
+ var(--_ctm-tab-dn-pr-tt-le-ht, var(--_ctm-dn-pr-tt-le-ht))
198
+ );
199
+ text-decoration: var(
200
+ --_ctm-mob-dn-pr-tt-ue,
201
+ var(--_ctm-tab-dn-pr-tt-ue, var(--_ctm-dn-pr-tt-ue))
202
+ );
203
+ }
204
+ }
205
+
206
+ .search-button {
207
+ color: #fff;
208
+ border: none;
209
+ padding-left: 10px;
210
+ border-radius: 4px;
211
+ // cursor: pointer;
212
+ transition: 0.3s;
213
+ svg {
214
+ width: var(
215
+ --_ctm-mob-dn-sh-in-in-se,
216
+ var(--_ctm-tab-dn-sh-in-in-se, var(--_ctm-dn-sh-in-in-se))
217
+ );
218
+ height: var(
219
+ --_ctm-mob-dn-sh-in-in-se,
220
+ var(--_ctm-tab-dn-sh-in-in-se, var(--_ctm-dn-sh-in-in-se))
221
+ );
222
+
223
+ path {
224
+ stroke: var(
225
+ --_ctm-mob-dn-sh-in-in-c1,
226
+ var(--_ctm-tab-dn-sh-in-in-c1, var(--_ctm-dn-sh-in-in-c1))
227
+ );
228
+ }
229
+ }
230
+
231
+ // &:hover {
232
+ // background: #0056b3;
233
+ // }
234
+ }
235
+ }
236
+
237
+ .confirm__btn {
238
+ cursor: pointer;
239
+ display: flex;
240
+ justify-content: center;
241
+ align-items: center;
242
+ padding: 8px;
243
+ gap: 8px;
244
+ width: 100%;
245
+ height: 100%;
246
+
247
+ background-color: var(
248
+ --_ctm-mob-dn-vw-os-bn-dt-se-bd-cr,
249
+ var(--_ctm-tab-dn-vw-os-bn-dt-se-bd-cr, var(--_ctm-dn-vw-os-bn-dt-se-bd-cr))
250
+ );
251
+ color: var(
252
+ --_ctm-mob-dn-vw-os-bn-dt-se-cr,
253
+ var(--_ctm-tab-dn-vw-os-bn-dt-se-cr, var(--_ctm-dn-vw-os-bn-dt-se-cr))
254
+ );
255
+
256
+ border-color: var(
257
+ --_show-border-im-se,
258
+ var(
259
+ --_ctm-mob-dn-vw-os-bn-dt-se-br-cr,
260
+ var(--_ctm-tab-dn-vw-os-bn-dt-se-br-cr, var(--_ctm-dn-vw-os-bn-dt-se-br-cr))
261
+ )
262
+ );
263
+ border-style: var(
264
+ --_show-border-im-se,
265
+ var(
266
+ --_ctm-mob-dn-vw-os-bn-dt-se-br-se,
267
+ var(--_ctm-tab-dn-vw-os-bn-dt-se-br-se, var(--_ctm-dn-vw-os-bn-dt-se-br-se))
268
+ )
269
+ );
270
+ border-width: var(
271
+ --_show-border-im-se,
272
+ var(
273
+ --_ctm-mob-dn-vw-os-bn-dt-se-br-wh,
274
+ var(--_ctm-tab-dn-vw-os-bn-dt-se-br-wh, var(--_ctm-dn-vw-os-bn-dt-se-br-wh))
275
+ )
276
+ );
277
+ border-radius: var(
278
+ --_ctm-mob-dn-vw-os-bn-dt-se-br-rs,
279
+ var(--_ctm-tab-dn-vw-os-bn-dt-se-br-rs, var(--_ctm-dn-vw-os-bn-dt-se-br-rs))
280
+ );
281
+
282
+ box-shadow: var(
283
+ --_show-shadow-im-se,
284
+ var(
285
+ --_ctm-mob-dn-vw-os-bn-dt-se-sw-ae,
286
+ var(--_ctm-tab-dn-vw-os-bn-dt-se-sw-ae, var(--_ctm-dn-vw-os-bn-dt-se-sw-ae))
287
+ )
288
+ var(
289
+ --_ctm-mob-dn-vw-os-bn-dt-se-sw-br,
290
+ var(--_ctm-tab-dn-vw-os-bn-dt-se-sw-br, var(--_ctm-dn-vw-os-bn-dt-se-sw-br))
291
+ )
292
+ var(
293
+ --_ctm-mob-dn-vw-os-bn-dt-se-sw-sd,
294
+ var(--_ctm-tab-dn-vw-os-bn-dt-se-sw-sd, var(--_ctm-dn-vw-os-bn-dt-se-sw-sd))
295
+ )
296
+ var(
297
+ --_ctm-mob-dn-vw-os-bn-dt-se-sw-cr,
298
+ var(--_ctm-tab-dn-vw-os-bn-dt-se-sw-cr, var(--_ctm-dn-vw-os-bn-dt-se-sw-cr))
299
+ )
300
+ );
301
+
302
+ font-family: var(
303
+ --_ctm-mob-dn-vw-os-bn-dt-se-ft-fy,
304
+ var(--_ctm-tab-dn-vw-os-bn-dt-se-ft-fy, var(--_ctm-dn-vw-os-bn-dt-se-ft-fy))
305
+ );
306
+ font-size: var(
307
+ --_ctm-mob-dn-vw-os-bn-dt-se-ft-se,
308
+ var(--_ctm-tab-dn-vw-os-bn-dt-se-ft-se, var(--_ctm-dn-vw-os-bn-dt-se-ft-se))
309
+ );
310
+ font-weight: var(
311
+ --_ctm-mob-dn-vw-os-bn-dt-se-ft-wt,
312
+ var(--_ctm-tab-dn-vw-os-bn-dt-se-ft-wt, var(--_ctm-dn-vw-os-bn-dt-se-ft-wt))
313
+ );
314
+ font-style: var(
315
+ --_ctm-mob-dn-vw-os-bn-dt-se-ft-se-ic,
316
+ var(--_ctm-tab-dn-vw-os-bn-dt-se-ft-se-ic, var(--_ctm-dn-vw-os-bn-dt-se-ft-se-ic))
317
+ );
318
+ text-align: var(
319
+ --_ctm-mob-dn-vw-os-bn-dt-se-tt-an,
320
+ var(--_ctm-tab-dn-vw-os-bn-dt-se-tt-an, var(--_ctm-dn-vw-os-bn-dt-se-tt-an))
321
+ );
322
+ letter-spacing: var(
323
+ --_ctm-mob-dn-vw-os-bn-dt-se-lr-sg,
324
+ var(--_ctm-tab-dn-vw-os-bn-dt-se-lr-sg, var(--_ctm-dn-vw-os-bn-dt-se-lr-sg))
325
+ );
326
+ line-height: var(
327
+ --_ctm-mob-dn-vw-os-bn-dt-se-le-ht,
328
+ var(--_ctm-tab-dn-vw-os-bn-dt-se-le-ht, var(--_ctm-dn-vw-os-bn-dt-se-le-ht))
329
+ );
330
+ text-decoration: var(
331
+ --_ctm-mob-dn-vw-os-bn-dt-se-ue,
332
+ var(--_ctm-tab-dn-vw-os-bn-dt-se-ue, var(--_ctm-dn-vw-os-bn-dt-se-ue))
333
+ );
334
+
335
+ svg {
336
+ width: var(
337
+ --_ctm-mob-dn-vw-os-bn-dt-se-in-se,
338
+ var(--_ctm-tab-dn-vw-os-bn-dt-se-in-se, var(--_ctm-dn-vw-os-bn-dt-se-in-se))
339
+ );
340
+ height: var(
341
+ --_ctm-mob-dn-vw-os-bn-dt-se-in-se,
342
+ var(--_ctm-tab-dn-vw-os-bn-dt-se-in-se, var(--_ctm-dn-vw-os-bn-dt-se-in-se))
343
+ );
344
+ path {
345
+ stroke: var(
346
+ --_ctm-mob-dn-vw-os-bn-dt-se-in-c1,
347
+ var(--_ctm-tab-dn-vw-os-bn-dt-se-in-c1, var(--_ctm-dn-vw-os-bn-dt-se-in-c1))
348
+ );
349
+ }
350
+ }
351
+ &:hover {
352
+ background-color: var(
353
+ --_ctm-mob-dn-vw-os-bn-hr-se-bd-cr,
354
+ var(--_ctm-tab-dn-vw-os-bn-hr-se-bd-cr, var(--_ctm-dn-vw-os-bn-hr-se-bd-cr))
355
+ );
356
+
357
+ border-color: var(
358
+ --_show-border-im-se,
359
+ var(
360
+ --_ctm-mob-dn-vw-os-bn-hr-se-br-cr,
361
+ var(--_ctm-tab-dn-vw-os-bn-hr-se-br-cr, var(--_ctm-dn-vw-os-bn-hr-se-br-cr))
362
+ )
363
+ );
364
+ border-style: var(
365
+ --_show-border-im-se,
366
+ var(
367
+ --_ctm-mob-dn-vw-os-bn-hr-se-br-se,
368
+ var(--_ctm-tab-dn-vw-os-bn-hr-se-br-se, var(--_ctm-dn-vw-os-bn-hr-se-br-se))
369
+ )
370
+ );
371
+ border-width: var(
372
+ --_show-border-im-se,
373
+ var(
374
+ --_ctm-mob-dn-vw-os-bn-hr-se-br-wh,
375
+ var(--_ctm-tab-dn-vw-os-bn-hr-se-br-wh, var(--_ctm-dn-vw-os-bn-hr-se-br-wh))
376
+ )
377
+ );
378
+ border-radius: var(
379
+ --_ctm-mob-dn-vw-os-bn-hr-se-br-rs,
380
+ var(--_ctm-tab-dn-vw-os-bn-hr-se-br-rs, var(--_ctm-dn-vw-os-bn-hr-se-br-rs))
381
+ );
382
+
383
+ box-shadow: var(
384
+ --_show-shadow-im-se,
385
+ var(
386
+ --_ctm-mob-dn-vw-os-bn-hr-se-sw-ae,
387
+ var(--_ctm-tab-dn-vw-os-bn-hr-se-sw-ae, var(--_ctm-dn-vw-os-bn-hr-se-sw-ae))
388
+ )
389
+ var(
390
+ --_ctm-mob-dn-vw-os-bn-hr-se-sw-br,
391
+ var(--_ctm-tab-dn-vw-os-bn-hr-se-sw-br, var(--_ctm-dn-vw-os-bn-hr-se-sw-br))
392
+ )
393
+ var(
394
+ --_ctm-mob-dn-vw-os-bn-hr-se-sw-sd,
395
+ var(--_ctm-tab-dn-vw-os-bn-hr-se-sw-sd, var(--_ctm-dn-vw-os-bn-hr-se-sw-sd))
396
+ )
397
+ var(
398
+ --_ctm-mob-dn-vw-os-bn-hr-se-sw-cr,
399
+ var(--_ctm-tab-dn-vw-os-bn-hr-se-sw-cr, var(--_ctm-dn-vw-os-bn-hr-se-sw-cr))
400
+ )
401
+ );
402
+
403
+ color: var(
404
+ --_ctm-mob-dn-vw-os-bn-hr-se-cr,
405
+ var(--_ctm-tab-dn-vw-os-bn-hr-se-cr, var(--_ctm-dn-vw-os-bn-hr-se-cr))
406
+ );
407
+
408
+ font-family: var(
409
+ --_ctm-mob-dn-vw-os-bn-hr-se-ft-fy,
410
+ var(--_ctm-tab-dn-vw-os-bn-hr-se-ft-fy, var(--_ctm-dn-vw-os-bn-hr-se-ft-fy))
411
+ );
412
+
413
+ font-size: var(
414
+ --_ctm-mob-dn-vw-os-bn-hr-se-ft-se,
415
+ var(--_ctm-tab-dn-vw-os-bn-hr-se-ft-se, var(--_ctm-dn-vw-os-bn-hr-se-ft-se))
416
+ );
417
+
418
+ font-weight: var(
419
+ --_ctm-mob-dn-vw-os-bn-hr-se-ft-wt,
420
+ var(--_ctm-tab-dn-vw-os-bn-hr-se-ft-wt, var(--_ctm-dn-vw-os-bn-hr-se-ft-wt))
421
+ );
422
+
423
+ font-style: var(
424
+ --_ctm-mob-dn-vw-os-bn-hr-se-ft-se-ic,
425
+ var(--_ctm-tab-dn-vw-os-bn-hr-se-ft-se-ic, var(--_ctm-dn-vw-os-bn-hr-se-ft-se-ic))
426
+ );
427
+
428
+ text-align: var(
429
+ --_ctm-mob-dn-vw-os-bn-hr-se-tt-an,
430
+ var(--_ctm-tab-dn-vw-os-bn-hr-se-tt-an, var(--_ctm-dn-vw-os-bn-hr-se-tt-an))
431
+ );
432
+
433
+ letter-spacing: var(
434
+ --_ctm-mob-dn-vw-os-bn-hr-se-lr-sg,
435
+ var(--_ctm-tab-dn-vw-os-bn-hr-se-lr-sg, var(--_ctm-dn-vw-os-bn-hr-se-lr-sg))
436
+ );
437
+
438
+ line-height: var(
439
+ --_ctm-mob-dn-vw-os-bn-hr-se-le-ht,
440
+ var(--_ctm-tab-dn-vw-os-bn-hr-se-le-ht, var(--_ctm-dn-vw-os-bn-hr-se-le-ht))
441
+ );
442
+
443
+ text-decoration: var(
444
+ --_ctm-mob-dn-vw-os-bn-hr-se-ue,
445
+ var(--_ctm-tab-dn-vw-os-bn-hr-se-ue, var(--_ctm-dn-vw-os-bn-hr-se-ue))
446
+ );
447
+
448
+ svg {
449
+ width: var(
450
+ --_ctm-mob-dn-vw-os-bn-hr-se-in-se,
451
+ var(--_ctm-tab-dn-vw-os-bn-hr-se-in-se, var(--_ctm-dn-vw-os-bn-hr-se-in-se))
452
+ );
453
+ height: var(
454
+ --_ctm-mob-dn-vw-os-bn-hr-se-in-se,
455
+ var(--_ctm-tab-dn-vw-os-bn-hr-se-in-se, var(--_ctm-dn-vw-os-bn-hr-se-in-se))
456
+ );
457
+ path {
458
+ stroke: var(
459
+ --_ctm-mob-dn-vw-os-bn-hr-se-in-c1,
460
+ var(--_ctm-tab-dn-vw-os-bn-hr-se-in-c1, var(--_ctm-dn-vw-os-bn-hr-se-in-c1))
461
+ );
462
+ }
463
+ }
464
+ }
465
+ }
466
+ }
467
+ .button__container {
468
+ background-color: var(--_gray-50);
469
+ .title {
470
+ font-size: 16px;
471
+ font-weight: 600;
472
+ color: #475467;
473
+ padding: 20px 0px 6px 0px;
474
+ background-color: #fff;
475
+ }
476
+
477
+ .form__container {
478
+ padding: 16px;
479
+ .form__header {
480
+ display: flex;
481
+ justify-content: space-between;
482
+ align-items: center;
483
+ cursor: pointer;
484
+ font-weight: 600;
485
+ color: var(--_primary-400);
486
+ color: var(
487
+ --_ctm-mob-dn-wt-tt-ss-cr,
488
+ var(--_ctm-tab-dn-wt-tt-ss-cr, var(--_ctm-dn-wt-tt-ss-cr))
489
+ );
490
+
491
+ font-family: var(
492
+ --_ctm-mob-dn-wt-tt-ss-ft-fy,
493
+ var(--_ctm-tab-dn-wt-tt-ss-ft-fy, var(--_ctm-dn-wt-tt-ss-ft-fy))
494
+ );
495
+
496
+ font-size: var(
497
+ --_ctm-mob-dn-wt-tt-ss-ft-se,
498
+ var(--_ctm-tab-dn-wt-tt-ss-ft-se, var(--_ctm-dn-wt-tt-ss-ft-se))
499
+ );
500
+
501
+ font-weight: var(
502
+ --_ctm-mob-dn-wt-tt-ss-ft-wt,
503
+ var(--_ctm-tab-dn-wt-tt-ss-ft-wt, var(--_ctm-dn-wt-tt-ss-ft-wt))
504
+ );
505
+
506
+ font-style: var(
507
+ --_ctm-mob-dn-wt-tt-ss-ft-se-ic,
508
+ var(--_ctm-tab-dn-wt-tt-ss-ft-se-ic, var(--_ctm-dn-wt-tt-ss-ft-se-ic))
509
+ );
510
+
511
+ text-align: var(
512
+ --_ctm-mob-dn-wt-tt-ss-tt-an,
513
+ var(--_ctm-tab-dn-wt-tt-ss-tt-an, var(--_ctm-dn-wt-tt-ss-tt-an))
514
+ );
515
+
516
+ letter-spacing: var(
517
+ --_ctm-mob-dn-wt-tt-ss-lr-sg,
518
+ var(--_ctm-tab-dn-wt-tt-ss-lr-sg, var(--_ctm-dn-wt-tt-ss-lr-sg))
519
+ );
520
+
521
+ line-height: var(
522
+ --_ctm-mob-dn-wt-tt-ss-le-ht,
523
+ var(--_ctm-tab-dn-wt-tt-ss-le-ht, var(--_ctm-dn-wt-tt-ss-le-ht))
524
+ );
525
+
526
+ text-decoration: var(
527
+ --_ctm-mob-dn-wt-tt-ss-ue,
528
+ var(--_ctm-tab-dn-wt-tt-ss-ue, var(--_ctm-dn-wt-tt-ss-ue))
529
+ );
530
+
531
+ button {
532
+ svg {
533
+ path {
534
+ stroke: var(--_primary-400);
535
+ }
536
+ }
537
+ }
538
+ }
539
+ .form__title {
540
+ margin-top: 12px;
541
+
542
+ color: var(
543
+ --_ctm-mob-dn-wt-tt-ss-cr-dc,
544
+ var(--_ctm-tab-dn-wt-tt-ss-cr-dc, var(--_ctm-dn-wt-tt-ss-cr-dc))
545
+ );
546
+
547
+ font-family: var(
548
+ --_ctm-mob-dn-wt-tt-ss-ft-fy-dc,
549
+ var(--_ctm-tab-dn-wt-tt-ss-ft-fy-dc, var(--_ctm-dn-wt-tt-ss-ft-fy-dc))
550
+ );
551
+
552
+ font-size: var(
553
+ --_ctm-mob-dn-wt-tt-ss-ft-se-dc,
554
+ var(--_ctm-tab-dn-wt-tt-ss-ft-se-dc, var(--_ctm-dn-wt-tt-ss-ft-se-dc))
555
+ );
556
+
557
+ font-weight: var(
558
+ --_ctm-mob-dn-wt-tt-ss-ft-wt-dc,
559
+ var(--_ctm-tab-dn-wt-tt-ss-ft-wt-dc, var(--_ctm-dn-wt-tt-ss-ft-wt-dc))
560
+ );
561
+
562
+ font-style: var(
563
+ --_ctm-mob-dn-wt-tt-ss-ft-se-ic-dc,
564
+ var(--_ctm-tab-dn-wt-tt-ss-ft-se-ic-dc, var(--_ctm-dn-wt-tt-ss-ft-se-ic-dc))
565
+ );
566
+
567
+ text-align: var(
568
+ --_ctm-mob-dn-wt-tt-ss-tt-an-dc,
569
+ var(--_ctm-tab-dn-wt-tt-ss-tt-an-dc, var(--_ctm-dn-wt-tt-ss-tt-an-dc))
570
+ );
571
+
572
+ letter-spacing: var(
573
+ --_ctm-mob-dn-wt-tt-ss-lr-sg-dc,
574
+ var(--_ctm-tab-dn-wt-tt-ss-lr-sg-dc, var(--_ctm-dn-wt-tt-ss-lr-sg-dc))
575
+ );
576
+
577
+ line-height: var(
578
+ --_ctm-mob-dn-wt-tt-ss-le-ht-dc,
579
+ var(--_ctm-tab-dn-wt-tt-ss-le-ht-dc, var(--_ctm-dn-wt-tt-ss-le-ht-dc))
580
+ );
581
+
582
+ text-decoration: var(
583
+ --_ctm-mob-dn-wt-tt-ss-ue-dc,
584
+ var(--_ctm-tab-dn-wt-tt-ss-ue-dc, var(--_ctm-dn-wt-tt-ss-ue-dc))
585
+ );
586
+ }
587
+ .est__dropdown {
588
+ & > button {
589
+ width: 100%;
590
+ & > span:last-child {
591
+ position: absolute;
592
+ top: 30;
593
+ right: 8;
594
+ }
595
+ }
596
+ }
597
+ .input__div {
598
+ margin-top: 10px;
599
+ display: flex;
600
+ flex-direction: column;
601
+ gap: 6px;
602
+ label {
603
+ font-size: 14px;
604
+ color: var(--_gray-700);
605
+ margin-bottom: 8px;
606
+ display: block;
607
+ }
608
+
609
+ input {
610
+ width: 100%;
611
+ padding: 6px 5px;
612
+ border: 1px solid var(--_gray-400);
613
+ border-radius: 6px;
614
+ font-size: 1rem;
615
+ font-family: inherit;
616
+ transition:
617
+ border-color 0.2s ease,
618
+ box-shadow 0.2s ease;
619
+ }
620
+
621
+ // input:focus {
622
+ // border-color: #4f46e5; /* Indigo */
623
+ // box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.2);
624
+ // outline: none;
625
+ // }
626
+ .error__message {
627
+ color: red;
628
+ font-size: 12px;
629
+ }
630
+ }
631
+ }
632
+ .payment__methods {
633
+ &:has(.stack__vertical) {
634
+ .content__title {
635
+ border-bottom: 1px solid var(--_gray-300);
636
+ }
637
+ }
638
+ .shippng__title {
639
+ margin: 16px;
640
+ padding-bottom: 10px;
641
+ margin-bottom: 0px;
642
+ color: var(
643
+ --_ctm-mob-dn-sg-ne-cr,
644
+ var(--_ctm-tab-dn-sg-ne-cr, var(--_ctm-dn-sg-ne-cr))
645
+ );
646
+ font-family: var(
647
+ --_ctm-mob-dn-sg-ne-ft-fy,
648
+ var(--_ctm-tab-dn-sg-ne-ft-fy, var(--_ctm-dn-sg-ne-ft-fy))
649
+ );
650
+ font-size: var(
651
+ --_ctm-mob-dn-sg-ne-ft-se,
652
+ var(--_ctm-tab-dn-sg-ne-ft-se, var(--_ctm-dn-sg-ne-ft-se))
653
+ );
654
+ font-weight: var(
655
+ --_ctm-mob-dn-sg-ne-ft-wt,
656
+ var(--_ctm-tab-dn-sg-ne-ft-wt, var(--_ctm-dn-sg-ne-ft-wt))
657
+ );
658
+ font-style: var(
659
+ --_ctm-mob-dn-it-se-ft-se-ic,
660
+ var(--_ctm-tab-dn-it-se-ft-se-ic, var(--_ctm-dn-it-se-ft-se-ic))
661
+ );
662
+ text-align: var(
663
+ --_ctm-mob-dn-sg-ne-tt-an,
664
+ var(--_ctm-tab-dn-sg-ne-tt-an, var(--_ctm-dn-sg-ne-tt-an))
665
+ );
666
+ letter-spacing: var(
667
+ --_ctm-mob-dn-it-se-lr-sg,
668
+ var(--_ctm-tab-dn-it-se-lr-sg, var(--_ctm-dn-it-se-lr-sg))
669
+ );
670
+ line-height: var(
671
+ --_ctm-mob-dn-sg-ne-le-ht,
672
+ var(--_ctm-tab-dn-sg-ne-le-ht, var(--_ctm-dn-sg-ne-le-ht))
673
+ );
674
+ text-decoration: var(
675
+ --_ctm-mob-dn-wt-tt-ss-ue-dc,
676
+ var(--_ctm-tab-dn-wt-tt-ss-ue-dc, var(--_ctm-dn-wt-tt-ss-ue-dc))
677
+ );
678
+ }
679
+
680
+ .stack {
681
+ display: grid;
682
+ background-color: #fff;
683
+ &.stack__vertical {
684
+ grid-template-columns: repeat(auto-fit, minmax(100%, 1fr));
685
+ gap: var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg)));
686
+ // max-height: var(--_sf-custom-height);
687
+ // overflow-y: auto;
688
+ max-height: var(--_sf-custom-height);
689
+ overflow-y: hidden;
690
+
691
+ &[data-add-scroll="true"] {
692
+ overflow-y: auto;
693
+ }
694
+ }
695
+ &.stack__horizontal {
696
+ // grid-template-columns: repeat(auto-fit, minmax(48%, 1fr));
697
+ display: flex;
698
+ gap: var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg)));
699
+ // padding: var(--_ctm-mob-lt-im-pg, var(--_ctm-tab-lt-im-pg, var(--_ctm-lt-im-pg)));
700
+ width: 100%;
701
+ background-color: #fff;
702
+
703
+ &[data-overflow="Wrap"] {
704
+ flex-wrap: wrap;
705
+ }
706
+ &[data-overflow="Scroll"] {
707
+ overflow-x: auto;
708
+ }
709
+ .item {
710
+ flex-wrap: nowrap;
711
+ }
712
+ }
713
+ &.grid {
714
+ display: grid;
715
+ grid-template-columns: repeat(
716
+ var(--_ctm-mob-lt-is-pr-rw, var(--_ctm-tab-lt-is-pr-rw, var(--_ctm-lt-is-pr-rw))),
717
+ minmax(auto, 1fr)
718
+ );
719
+ gap: var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg)));
720
+ // padding: var(--_ctm-mob-lt-im-pg, var(--_ctm-tab-lt-im-pg, var(--_ctm-lt-im-pg)));
721
+ max-height: var(--_sf-custom-height);
722
+ overflow-y: hidden;
723
+
724
+ &[data-add-scroll="true"] {
725
+ overflow-y: auto;
726
+ }
727
+ }
728
+ .item {
729
+ display: flex;
730
+ // justify-content: space-between;
731
+ gap: 20px;
732
+ align-items: center;
733
+ cursor: pointer;
734
+ background-color: var(--_primary-25);
735
+ flex-wrap: wrap;
736
+
737
+ height: var(--_ctm-mob-lt-im-ht, var(--_ctm-tab-lt-im-ht, var(--_ctm-lt-im-ht)));
738
+
739
+ // padding: var(
740
+ // --_ctm-mob-dn-im-se-vl-pg,
741
+ // var(--_ctm-tab-dn-im-se-vl-pg, var(--_ctm-dn-im-se-vl-pg))
742
+ // )
743
+ // var(
744
+ // --_ctm-mob-dn-im-se-hl-pg,
745
+ // var(--_ctm-tab-dn-im-se-hl-pg, var(--_ctm-dn-im-se-hl-pg))
746
+ // );
747
+
748
+ padding: var(--_ctm-mob-lt-im-pg, var(--_ctm-tab-lt-im-pg, var(--_ctm-lt-im-pg)));
749
+
750
+ background-color: var(
751
+ --_ctm-mob-dn-im-se-bd-cr,
752
+ var(--_ctm-tab-dn-im-se-bd-cr, var(--_ctm-dn-im-se-bd-cr))
753
+ );
754
+
755
+ border-color: var(
756
+ --_show-border-im-se,
757
+ var(
758
+ --_ctm-mob-dn-im-se-br-cr,
759
+ var(--_ctm-tab-dn-im-se-br-cr, var(--_ctm-dn-im-se-br-cr))
760
+ )
761
+ );
762
+ border-style: var(
763
+ --_show-border-im-se,
764
+ var(
765
+ --_ctm-mob-dn-im-se-br-se,
766
+ var(--_ctm-tab-dn-im-se-br-se, var(--_ctm-dn-im-se-br-se))
767
+ )
768
+ );
769
+ border-width: var(
770
+ --_show-border-im-se,
771
+ var(
772
+ --_ctm-mob-dn-im-se-br-wh,
773
+ var(--_ctm-tab-dn-im-se-br-wh, var(--_ctm-dn-im-se-br-wh))
774
+ )
775
+ );
776
+ border-radius: var(
777
+ --_ctm-mob-dn-im-se-br-rs,
778
+ var(--_ctm-tab-dn-im-se-br-rs, var(--_ctm-dn-im-se-br-rs))
779
+ );
780
+
781
+ box-shadow: var(
782
+ --_show-shadow-im-se,
783
+ var(
784
+ --_ctm-mob-dn-im-se-sw-ae,
785
+ var(--_ctm-tab-dn-im-se-sw-ae, var(--_ctm-dn-im-se-sw-ae))
786
+ )
787
+ var(
788
+ --_ctm-mob-dn-im-se-sw-br,
789
+ var(--_ctm-tab-dn-im-se-sw-br, var(--_ctm-dn-im-se-sw-br))
790
+ )
791
+ var(
792
+ --_ctm-mob-dn-im-se-sw-sd,
793
+ var(--_ctm-tab-dn-im-se-sw-sd, var(--_ctm-dn-im-se-sw-sd))
794
+ )
795
+ var(
796
+ --_ctm-mob-dn-im-se-sw-cr,
797
+ var(--_ctm-tab-dn-im-se-sw-cr, var(--_ctm-dn-im-se-sw-cr))
798
+ )
799
+ );
800
+ // .left__col {
801
+ // display: inline-block;
802
+ // font-weight: 600;
803
+ // input[type="radio"] {
804
+ // width: auto;
805
+ // display: inline-block;
806
+ // margin-right: 10px;
807
+ // }
808
+ // }
809
+
810
+ // .right__col {
811
+ // display: flex;
812
+ // align-items: center;
813
+ // text-align: center;
814
+ // gap: 16px;
815
+ // font-weight: 500;
816
+ // flex-wrap: wrap;
817
+ // justify-content: var(
818
+ // --_ctm-mob-dn-im-se-ct-at,
819
+ // var(--_ctm-tab-dn-im-se-ct-at, var(--_ctm-dn-im-se-ct-at))
820
+ // );
821
+
822
+ // span {
823
+ // line-height: 12px;
824
+ // }
825
+
826
+ // .card {
827
+ // width: 60px;
828
+ // height: 50px;
829
+ // background-color: var(
830
+ // --_ctm-mob-dn-sg-md-lo-bd-cr,
831
+ // var(--_ctm-tab-dn-sg-md-lo-bd-cr, var(--_ctm-dn-sg-md-lo-bd-cr))
832
+ // );
833
+ // border-color: var(
834
+ // --_ctm-mob-dn-sg-md-lo-br-cr,
835
+ // var(--_ctm-tab-dn-sg-md-lo-br-cr, var(--_ctm-dn-sg-md-lo-br-cr))
836
+ // );
837
+ // border-style: var(
838
+ // --_ctm-mob-dn-sg-md-lo-br-se,
839
+ // var(--_ctm-tab-dn-sg-md-lo-br-se, var(--_ctm-dn-sg-md-lo-br-se))
840
+ // );
841
+ // border-width: var(
842
+ // --_ctm-mob-dn-sg-md-lo-br-wh,
843
+ // var(--_ctm-tab-dn-sg-md-lo-br-wh, var(--_ctm-dn-sg-md-lo-br-wh))
844
+ // );
845
+ // border-radius: var(
846
+ // --_ctm-mob-dn-sg-md-lo-br-rs,
847
+ // var(--_ctm-tab-dn-sg-md-lo-br-rs, var(--_ctm-dn-sg-md-lo-br-rs))
848
+ // );
849
+ // box-shadow: var(
850
+ // var(
851
+ // --_ctm-mob-dn-sg-md-lo-sw-ae,
852
+ // var(
853
+ // --_ctm-tab-dn-sg-md-lo-sw-ae,
854
+ // var(--_ctm-dn-sg-md-lo-sw-ae, var(--_tst-dn-sw-ae))
855
+ // )
856
+ // )
857
+ // var(
858
+ // --_ctm-mob-dn-sg-md-lo-sw-br,
859
+ // var(
860
+ // --_ctm-tab-dn-sg-md-lo-sw-br,
861
+ // var(--_ctm-dn-sg-md-lo-sw-br, var(--_tst-dn-sw-br))
862
+ // )
863
+ // )
864
+ // var(
865
+ // --_ctm-mob-dn-sg-md-lo-sw-sd,
866
+ // var(
867
+ // --_ctm-tab-dn-sg-md-lo-sw-sd,
868
+ // var(--_ctm-dn-sg-md-lo-sw-sd, var(--_tst-dn-sw-sd))
869
+ // )
870
+ // )
871
+ // var(
872
+ // --_ctm-mob-dn-sg-md-lo-sw-cr,
873
+ // var(
874
+ // --_ctm-tab-dn-sg-md-lo-sw-cr,
875
+ // var(--_ctm-dn-sg-md-lo-sw-cr, var(--_tst-dn-sw-cr))
876
+ // )
877
+ // )
878
+ // );
879
+ // & > img {
880
+ // width: 100%;
881
+ // height: 100%;
882
+ // }
883
+ // }
884
+ // }
885
+ p {
886
+ white-space: nowrap;
887
+ }
888
+ }
889
+ }
890
+ .stack__table {
891
+ width: 100%;
892
+ border-collapse: collapse;
893
+ border-radius: 6px;
894
+ background-color: var(
895
+ --_ctm-mob-dn-te-bd-cr,
896
+ var(--_ctm-tab-dn-te-bd-cr, var(--_ctm-dn-te-bd-cr))
897
+ );
898
+ border-color: var(
899
+ --_show-border-im-se,
900
+ var(--_ctm-mob-dn-te-br-cr, var(--_ctm-tab-dn-te-br-cr, var(--_ctm-dn-te-br-cr)))
901
+ );
902
+ border-style: var(
903
+ --_show-border-im-se,
904
+ var(--_ctm-mob-dn-te-br-se, var(--_ctm-tab-dn-te-br-se, var(--_ctm-dn-te-br-se)))
905
+ );
906
+ border-width: var(
907
+ --_show-border-im-se,
908
+ var(--_ctm-mob-dn-te-br-wh, var(--_ctm-tab-dn-te-br-wh, var(--_ctm-dn-te-br-wh)))
909
+ );
910
+ border-radius: var(
911
+ --_ctm-mob-dn-te-br-rs,
912
+ var(--_ctm-tab-dn-te-br-rs, var(--_ctm-dn-te-br-rs))
913
+ );
914
+ box-shadow: var(
915
+ --_show-shadow-im-se,
916
+ var(--_ctm-mob-dn-te-sw-ae, var(--_ctm-tab-dn-te-sw-ae, var(--_ctm-dn-te-sw-ae)))
917
+ var(--_ctm-mob-dn-te-sw-br, var(--_ctm-tab-dn-te-sw-br, var(--_ctm-dn-te-sw-br)))
918
+ var(--_ctm-mob-dn-te-sw-sd, var(--_ctm-tab-dn-te-sw-sd, var(--_ctm-dn-te-sw-sd)))
919
+ var(--_ctm-mob-dn-te-sw-cr, var(--_ctm-tab-dn-te-sw-cr, var(--_ctm-dn-te-sw-cr)))
920
+ );
921
+ &[data-header-divider="true"] {
922
+ thead tr th {
923
+ border-bottom: 1px solid
924
+ var(
925
+ --_ctm-mob-dn-rw-ds-hr-dr,
926
+ var(--_ctm-tab-dn-rw-ds-hr-dr, var(--_ctm-dn-rw-ds-hr-dr))
927
+ );
928
+ }
929
+ }
930
+ &[data-row-divider="true"] {
931
+ tbody tr td {
932
+ border-bottom: 1px solid
933
+ var(
934
+ --_ctm-mob-dn-rw-ds-rw-dr,
935
+ var(--_ctm-tab-dn-rw-ds-rw-dr, var(--_ctm-dn-rw-ds-rw-dr))
936
+ );
937
+ }
938
+ }
939
+ &[data-column-divider="true"] {
940
+ tbody tr td,
941
+ thead tr th {
942
+ border-right: 1px solid
943
+ var(
944
+ --_ctm-mob-dn-rw-ds-cn-dr,
945
+ var(--_ctm-tab-dn-rw-ds-cn-dr, var(--_ctm-dn-rw-ds-cn-dr))
946
+ );
947
+ }
948
+
949
+ tbody tr td:last-child,
950
+ thead tr th:last-child {
951
+ border-right: none;
952
+ }
953
+ }
954
+ &[data-alternative-row-colors="true"] {
955
+ tbody tr:nth-child(odd) {
956
+ background-color: var(--_gray-300);
957
+ width: 100%;
958
+ }
959
+ }
960
+ thead {
961
+ height: var(--_ctm-mob-lt-hr-ht, var(--_ctm-tab-lt-hr-ht, var(--_ctm-dn-lt-hr-ht)));
962
+ tr {
963
+ th {
964
+ padding: var(
965
+ --_ctm-mob-lt-hr-cl-pg,
966
+ var(--_ctm-tab-lt-hr-cl-pg, var(--_ctm-dn-lt-hr-cl-pg))
967
+ );
968
+ text-align: var(
969
+ --_ctm-mob-lt-ct-at,
970
+ var(--_ctm-tab-lt-ct-at, var(--_ctm-dn-lt-ct-at))
971
+ );
972
+ border: 0;
973
+ background-color: var(
974
+ --_ctm-mob-dn-te-hr-bd-cr,
975
+ var(--_ctm-tab-dn-te-hr-bd-cr, var(--_ctm-dn-te-hr-bd-cr))
976
+ );
977
+ color: var(
978
+ --_ctm-mob-dn-hr-tt-cr,
979
+ var(--_ctm-tab-dn-hr-tt-cr, var(--_ctm-dn-hr-tt-cr))
980
+ );
981
+ font-family: var(
982
+ --_ctm-mob-dn-hr-tt-ft-fy,
983
+ var(--_ctm-tab-dn-hr-tt-ft-fy, var(--_ctm-dn-hr-tt-ft-fy))
984
+ );
985
+ font-size: var(
986
+ --_ctm-mob-dn-hr-tt-ft-se,
987
+ var(--_ctm-tab-dn-hr-tt-ft-se, var(--_ctm-dn-hr-tt-ft-se))
988
+ );
989
+ font-weight: var(
990
+ --_ctm-mob-dn-hr-tt-ft-wt,
991
+ var(--_ctm-tab-dn-hr-tt-ft-wt, var(--_ctm-dn-hr-tt-ft-wt))
992
+ );
993
+ font-style: var(
994
+ --_ctm-mob-dn-hr-tt-ft-se-ic,
995
+ var(--_ctm-tab-dn-hr-tt-ft-se-ic, var(--_ctm-dn-hr-tt-ft-se-ic))
996
+ );
997
+ text-align: var(
998
+ --_ctm-mob-dn-hr-tt-tt-an,
999
+ var(--_ctm-tab-dn-hr-tt-an, var(--_ctm-dn-hr-tt-an))
1000
+ );
1001
+ letter-spacing: var(
1002
+ --_ctm-mob-dn-hr-tt-lr-sg,
1003
+ var(--_ctm-tab-dn-hr-tt-lr-sg, var(--_ctm-dn-hr-tt-lr-sg))
1004
+ );
1005
+ line-height: var(
1006
+ --_ctm-mob-dn-hr-tt-le-ht,
1007
+ var(--_ctm-tab-dn-hr-tt-le-ht, var(--_ctm-dn-hr-tt-le-ht))
1008
+ );
1009
+ text-decoration: var(
1010
+ --_ctm-mob-dn-hr-tt-ue,
1011
+ var(--_ctm-tab-dn-hr-tt-ue, var(--_ctm-dn-hr-tt-ue))
1012
+ );
1013
+ }
1014
+ }
1015
+ }
1016
+ tbody {
1017
+ tr {
1018
+ padding: var(
1019
+ --_ctm-mob-lt-rw-cl-pg,
1020
+ var(--_ctm-tab-lt-rw-cl-pg, var(--_ctm-dn-lt-rw-cl-pg))
1021
+ );
1022
+ height: var(
1023
+ --_ctm-mob-lt-rw-ht,
1024
+ var(--_ctm-tab-lt-rw-ht, var(--_ctm-dn-lt-rw-ht))
1025
+ );
1026
+ background-color: var(
1027
+ --_ctm-mob-dn-te-rw-bd-cr,
1028
+ var(--_ctm-tab-dn-te-rw-bd-cr, var(--_ctm-dn-te-rw-bd-cr))
1029
+ );
1030
+ text-align: var(
1031
+ --_ctm-mob-lt-ct-at,
1032
+ var(--_ctm-tab-lt-ct-at, var(--_ctm-dn-lt-ct-at))
1033
+ );
1034
+ th,
1035
+ td {
1036
+ border: 0;
1037
+ padding: inherit;
1038
+ color: var(
1039
+ --_ctm-mob-dn-te-rw-cr,
1040
+ var(--_ctm-tab-dn-te-rw-cr, var(--_ctm-dn-te-rw-cr))
1041
+ );
1042
+ font-family: var(
1043
+ --_ctm-mob-dn-te-rw-ft-fy,
1044
+ var(--_ctm-tab-dn-te-rw-ft-fy, var(--_ctm-dn-te-rw-ft-fy))
1045
+ );
1046
+ font-size: var(
1047
+ --_ctm-mob-dn-te-rw-ft-se,
1048
+ var(--_ctm-tab-dn-te-rw-ft-se, var(--_ctm-dn-te-rw-ft-se))
1049
+ );
1050
+ font-weight: var(
1051
+ --_ctm-mob-dn-te-rw-ft-wt,
1052
+ var(--_ctm-tab-dn-te-rw-ft-wt, var(--_ctm-dn-te-rw-ft-wt))
1053
+ );
1054
+ font-style: var(
1055
+ --_ctm-mob-dn-te-rw-ft-se-ic,
1056
+ var(--_ctm-tab-dn-te-rw-ft-se-ic, var(--_ctm-dn-te-rw-ft-se-ic))
1057
+ );
1058
+ text-align: var(
1059
+ --_ctm-mob-dn-te-rw-tt-an,
1060
+ var(--_ctm-tab-dn-te-rw-tt-an, var(--_ctm-dn-te-rw-tt-an))
1061
+ );
1062
+ letter-spacing: var(
1063
+ --_ctm-mob-dn-te-rw-lr-sg,
1064
+ var(--_ctm-tab-dn-te-rw-lr-sg, var(--_ctm-dn-te-rw-lr-sg))
1065
+ );
1066
+ line-height: var(
1067
+ --_ctm-mob-dn-te-rw-le-ht,
1068
+ var(--_ctm-tab-dn-te-rw-le-ht, var(--_ctm-dn-te-rw-le-ht))
1069
+ );
1070
+ text-decoration: var(
1071
+ --_ctm-mob-dn-te-rw-ue,
1072
+ var(--_ctm-tab-dn-te-rw-ue, var(--_ctm-dn-te-rw-ue))
1073
+ );
1074
+ }
1075
+ }
1076
+ }
1077
+ }
1078
+ }
1079
+ }
1080
+ }
1081
+ }
1082
+ }
1083
+ }