@sc-360-v2/storefront-cms-library 0.5.53 → 0.5.55

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