@sc-360-v2/storefront-cms-library 0.2.75 → 0.2.77

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 (104) hide show
  1. package/dist/add-order.scss +69 -0
  2. package/dist/allocationDetails.scss +335 -0
  3. package/dist/allocations.scss +546 -2
  4. package/dist/amount-estimator.scss +733 -187
  5. package/dist/brand-basic-elements.scss +142 -61
  6. package/dist/brand.scss +66 -16
  7. package/dist/breadcrumbs.scss +379 -88
  8. package/dist/builder.js +1 -1
  9. package/dist/bulk-variant-picker.scss +525 -121
  10. package/dist/bundle-basic-elements.scss +283 -121
  11. package/dist/bundle.scss +74 -15
  12. package/dist/buyFor.scss +153 -0
  13. package/dist/cart-details.scss +387 -0
  14. package/dist/cart-summary.scss +175 -0
  15. package/dist/cart.scss +178 -44
  16. package/dist/cartDropdownOverlay.scss +118 -0
  17. package/dist/cartGrouping.scss +89 -0
  18. package/dist/category.scss +38 -7
  19. package/dist/categoryDetails.scss +24 -6
  20. package/dist/categoryWidget.scss +11 -6
  21. package/dist/code-temp.scss +6 -4
  22. package/dist/contact-us.scss +19 -147
  23. package/dist/container.scss +22 -1
  24. package/dist/countdown.scss +372 -112
  25. package/dist/editCartItem.scss +111 -0
  26. package/dist/embed-temp.scss +29 -14
  27. package/dist/faq.scss +3 -6
  28. package/dist/filters.scss +11 -2
  29. package/dist/form-preview.scss +128 -93
  30. package/dist/gallery-slider-temp.scss +548 -135
  31. package/dist/grid.scss +24 -0
  32. package/dist/hotspot.scss +27 -25
  33. package/dist/icon-library.scss +26 -15
  34. package/dist/icons.js +1 -1
  35. package/dist/image-temp.scss +45 -17
  36. package/dist/index.js +1 -1
  37. package/dist/item-stock.scss +125 -0
  38. package/dist/layouter-item.scss +26 -2
  39. package/dist/layouter.scss +26 -1
  40. package/dist/light-box-v2.scss +29 -3
  41. package/dist/lightbox.scss +18 -2
  42. package/dist/line.scss +165 -0
  43. package/dist/login.scss +15 -23
  44. package/dist/map.scss +495 -119
  45. package/dist/marchandiserSets.scss +35 -18
  46. package/dist/menu.scss +121 -33
  47. package/dist/modal.scss +4 -0
  48. package/dist/past-orders.scss +11 -2
  49. package/dist/payment-methods.scss +29 -13
  50. package/dist/pickup-locations.scss +884 -244
  51. package/dist/product-actions.scss +2223 -418
  52. package/dist/product-basic-elements.scss +273 -122
  53. package/dist/product-highlights.scss +22 -14
  54. package/dist/product-image.scss +535 -136
  55. package/dist/product-inventory.scss +1105 -283
  56. package/dist/product-options.scss +378 -94
  57. package/dist/product-price.scss +1386 -316
  58. package/dist/product-promotions.scss +2252 -601
  59. package/dist/product.scss +68 -14
  60. package/dist/productDetails.scss +29 -2
  61. package/dist/profile.scss +19 -4
  62. package/dist/quantity-selector.scss +5 -4
  63. package/dist/quick-links.scss +277 -0
  64. package/dist/quotes.scss +11 -2
  65. package/dist/repeater-item.scss +26 -2
  66. package/dist/repeater.scss +60 -7
  67. package/dist/rfqs.scss +11 -2
  68. package/dist/scroll.scss +112 -47
  69. package/dist/search-results-heading.scss +282 -0
  70. package/dist/search.scss +84 -23
  71. package/dist/section.scss +25 -1
  72. package/dist/shareCartSideBar.scss +230 -0
  73. package/dist/shipping-estimator.scss +7 -3
  74. package/dist/social.scss +148 -38
  75. package/dist/sort.scss +11 -2
  76. package/dist/stack.scss +23 -3
  77. package/dist/static-text.scss +0 -1
  78. package/dist/store-locations.scss +887 -244
  79. package/dist/sub-category.scss +50 -19
  80. package/dist/tab-container-item.scss +80 -0
  81. package/dist/tab-container.scss +89 -0
  82. package/dist/tab-v2.scss +579 -0
  83. package/dist/table.scss +370 -91
  84. package/dist/tabs.scss +334 -74
  85. package/dist/text-temp-v2.scss +21 -9
  86. package/dist/types/builder/elements/add-order/index.d.ts +27 -0
  87. package/dist/types/builder/elements/create-form/index.d.ts +27 -0
  88. package/dist/types/builder/elements/form-builder/index.d.ts +2 -2
  89. package/dist/types/builder/elements/image/index.d.ts +13 -0
  90. package/dist/types/builder/enums/index.d.ts +5 -1
  91. package/dist/types/builder/index.d.ts +3 -1
  92. package/dist/types/builder/interfaces/global.d.ts +5 -0
  93. package/dist/types/builder/tools/element-edit/addOrder.d.ts +28 -0
  94. package/dist/types/builder/tools/element-edit/createForm.d.ts +15 -0
  95. package/dist/types/builder/tools/element-edit/index.d.ts +3 -1
  96. package/dist/uom-selector.scss +1569 -383
  97. package/dist/variant-picker.scss +1593 -481
  98. package/dist/video.scss +212 -53
  99. package/dist/volume-pricing.scss +775 -196
  100. package/dist/widget.scss +14 -0
  101. package/package.json +1 -1
  102. package/dist/editor-core.scss +0 -537
  103. package/dist/tab-panel.scss +0 -93
  104. package/dist/text-editor.scss +0 -331
@@ -10,7 +10,7 @@
10
10
  // padding: var(--_lt-pg);
11
11
  // width: var(--_ctm-lt-wh, var(--_tst-lt-wh));
12
12
  // width: var(--_sf-nw-wh, var(--_tst-lt-wh));
13
- margin: var(--_ctm-lt-mn, --_tst-lt-mn);
13
+ margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));
14
14
  // height: var(--_ctm-lt-ht, var(--_tst-lt-ht));
15
15
  // height: ;
16
16
  // aspect-ratio: 1 / var(--_sf-aspect-ratio);
@@ -34,15 +34,18 @@
34
34
  .bulk_variant__container {
35
35
  display: flex;
36
36
  flex-direction: column;
37
- gap: var(--_ctm-lt-im-sg);
38
- padding: var(--_ctm-lt-pg);
37
+ gap: var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg)));
38
+ padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
39
39
  // Select Colors
40
40
  .select__colors {
41
41
  font-size: 16px;
42
42
  color: var(--_gray-500);
43
43
  display: flex;
44
44
  flex-direction: column;
45
- gap: var(--_ctm-lt-on-te-ve-sg);
45
+ gap: var(
46
+ --_ctm-mob-lt-on-te-ve-sg,
47
+ var(--_ctm-tab-lt-on-te-ve-sg, var(--_ctm-lt-on-te-ve-sg))
48
+ );
46
49
  .title {
47
50
  margin-bottom: 4px;
48
51
  }
@@ -55,8 +58,14 @@
55
58
  flex-direction: column;
56
59
  }
57
60
  .item {
58
- padding: var(--_ctm-lt-sh-te-dy-se-im-pg);
59
- background-color: var(--_ctm-dn-sh-on-ve-se-dt-se-bd-cr);
61
+ padding: var(
62
+ --_ctm-mob-lt-sh-te-dy-se-im-pg,
63
+ var(--_ctm-tab-lt-sh-te-dy-se-im-pg, var(--_ctm-lt-sh-te-dy-se-im-pg))
64
+ );
65
+ background-color: var(
66
+ --_ctm-mob-dn-sh-on-ve-se-dt-se-bd-cr,
67
+ var(--_ctm-tab-dn-sh-on-ve-se-dt-se-bd-cr, var(--_ctm-dn-sh-on-ve-se-dt-se-bd-cr))
68
+ );
60
69
  // height: 30px;
61
70
  // width: 30px;
62
71
  // &[data-dt-se-bd-se="Circle"] {
@@ -67,7 +76,10 @@
67
76
  // width: 0;
68
77
  // }
69
78
  &:hover {
70
- background-color: var(--_ctm-dn-sh-on-ve-se-hr-se-bd-cr);
79
+ background-color: var(
80
+ --_ctm-mob-dn-sh-on-ve-se-hr-se-bd-cr,
81
+ var(--_ctm-tab-dn-sh-on-ve-se-hr-se-bd-cr, var(--_ctm-dn-sh-on-ve-se-hr-se-bd-cr))
82
+ );
71
83
  // height: 30px;
72
84
  // width: 30px;
73
85
  // &[data-dt-se-bd-se="Circle"] {
@@ -79,7 +91,10 @@
79
91
  // }
80
92
  }
81
93
  &.selected_item {
82
- background-color: var(--_ctm-dn-sh-on-ve-se-sd-se-bd-cr);
94
+ background-color: var(
95
+ --_ctm-mob-dn-sh-on-ve-se-sd-se-bd-cr,
96
+ var(--_ctm-tab-dn-sh-on-ve-se-sd-se-bd-cr, var(--_ctm-dn-sh-on-ve-se-sd-se-bd-cr))
97
+ );
83
98
  // height: 30px;
84
99
  // width: 30px;
85
100
  // &[data-dt-se-bd-se="Circle"] {
@@ -96,76 +111,163 @@
96
111
  height: 30px;
97
112
  border-color: var(
98
113
  --_show-border-im-se,
99
- var(--_ctm-dn-sh-on-ve-se-dt-se-br-cr, var(--_tst-dn-br-cr))
114
+ var(
115
+ --_ctm-mob-dn-sh-on-ve-se-dt-se-br-cr,
116
+ var(--_ctm-tab-dn-sh-on-ve-se-dt-se-br-cr, var(--_ctm-dn-sh-on-ve-se-dt-se-br-cr))
117
+ )
100
118
  );
119
+
101
120
  border-style: var(
102
121
  --_show-border-im-se,
103
- var(--_ctm-dn-sh-on-ve-se-dt-se-br-se, var(--_tst-dn-br-se))
122
+ var(
123
+ --_ctm-mob-dn-sh-on-ve-se-dt-se-br-se,
124
+ var(--_ctm-tab-dn-sh-on-ve-se-dt-se-br-se, var(--_ctm-dn-sh-on-ve-se-dt-se-br-se))
125
+ )
104
126
  );
127
+
105
128
  border-width: var(
106
129
  --_show-border-im-se,
107
- var(--_ctm-dn-sh-on-ve-se-dt-se-br-wh, var(--_tst-dn-br-wh))
130
+ var(
131
+ --_ctm-mob-dn-sh-on-ve-se-dt-se-br-wh,
132
+ var(--_ctm-tab-dn-sh-on-ve-se-dt-se-br-wh, var(--_ctm-dn-sh-on-ve-se-dt-se-br-wh))
133
+ )
134
+ );
135
+
136
+ border-radius: var(
137
+ --_ctm-mob-dn-sh-on-ve-se-dt-se-br-rs,
138
+ var(--_ctm-tab-dn-sh-on-ve-se-dt-se-br-rs, var(--_ctm-dn-sh-on-ve-se-dt-se-br-rs))
108
139
  );
109
- border-radius: var(--_ctm-dn-sh-on-ve-se-dt-se-br-rs, var(--_tst-dn-br-rs));
140
+
110
141
  box-shadow: var(
111
142
  --_show-shadow-im-se,
112
- var(--_ctm-dn-sh-on-ve-se-dt-se-sw-ae, var(--_tst-dn-sw-ae))
113
- var(--_ctm-dn-sh-on-ve-se-dt-se-sw-br, var(--_tst-dn-sw-br))
114
- var(--_ctm-dn-sh-on-ve-se-dt-se-sw-sd, var(--_tst-dn-sw-sd))
115
- var(--_ctm-dn-sh-on-ve-se-dt-se-sw-cr, var(--_tst-dn-sw-cr))
143
+ var(
144
+ --_ctm-mob-dn-sh-on-ve-se-dt-se-sw-ae,
145
+ var(
146
+ --_ctm-tab-dn-sh-on-ve-se-dt-se-sw-ae,
147
+ var(--_ctm-dn-sh-on-ve-se-dt-se-sw-ae)
148
+ )
149
+ )
150
+ var(
151
+ --_ctm-mob-dn-sh-on-ve-se-dt-se-sw-br,
152
+ var(
153
+ --_ctm-tab-dn-sh-on-ve-se-dt-se-sw-br,
154
+ var(--_ctm-dn-sh-on-ve-se-dt-se-sw-br)
155
+ )
156
+ )
157
+ var(
158
+ --_ctm-mob-dn-sh-on-ve-se-dt-se-sw-sd,
159
+ var(
160
+ --_ctm-tab-dn-sh-on-ve-se-dt-se-sw-sd,
161
+ var(--_ctm-dn-sh-on-ve-se-dt-se-sw-sd)
162
+ )
163
+ )
164
+ var(
165
+ --_ctm-mob-dn-sh-on-ve-se-dt-se-sw-cr,
166
+ var(
167
+ --_ctm-tab-dn-sh-on-ve-se-dt-se-sw-cr,
168
+ var(--_ctm-dn-sh-on-ve-se-dt-se-sw-cr)
169
+ )
170
+ )
116
171
  );
117
- border-radius: var(--_ctm-dn-sh-on-ve-se-dt-se-br-rs);
118
172
  cursor: pointer;
119
173
  overflow: hidden;
120
174
  &:hover {
121
175
  border-color: var(
122
- --_show-border-im-se,
123
- var(--_ctm-dn-sh-on-ve-se-hr-se-br-cr, var(--_tst-dn-br-cr))
176
+ --_ctm-mob-dn-sh-on-ve-se-hr-se-br-cr,
177
+ var(--_ctm-tab-dn-sh-on-ve-se-hr-se-br-cr, var(--_ctm-dn-sh-on-ve-se-hr-se-br-cr))
124
178
  );
125
179
  border-style: var(
126
- --_show-border-im-se,
127
- var(--_ctm-dn-sh-on-ve-se-hr-se-br-se, var(--_tst-dn-br-se))
180
+ --_ctm-mob-dn-sh-on-ve-se-hr-se-br-se,
181
+ var(--_ctm-tab-dn-sh-on-ve-se-hr-se-br-se, var(--_ctm-dn-sh-on-ve-se-hr-se-br-se))
128
182
  );
129
183
  border-width: var(
130
- --_show-border-im-se,
131
- var(--_ctm-dn-sh-on-ve-se-hr-se-br-wh, var(--_tst-dn-br-wh))
184
+ --_ctm-mob-dn-sh-on-ve-se-hr-se-br-wh,
185
+ var(--_ctm-tab-dn-sh-on-ve-se-hr-se-br-wh, var(--_ctm-dn-sh-on-ve-se-hr-se-br-wh))
132
186
  );
133
- border-radius: var(--_ctm-dn-sh-on-ve-se-hr-se-br-rs, var(--_tst-dn-br-rs));
134
- box-shadow: var(
135
- --_show-shadow-im-se,
136
- var(--_ctm-dn-sh-on-ve-se-hr-se-sw-ae, var(--_tst-dn-sw-ae))
137
- var(--_ctm-dn-sh-on-ve-se-hr-se-sw-br, var(--_tst-dn-sw-br))
138
- var(--_ctm-dn-sh-on-ve-se-hr-se-sw-sd, var(--_tst-dn-sw-sd))
139
- var(--_ctm-dn-sh-on-ve-se-hr-se-sw-cr, var(--_tst-dn-sw-cr))
187
+ border-radius: var(
188
+ --_ctm-mob-dn-sh-on-ve-se-hr-se-br-rs,
189
+ var(--_ctm-tab-dn-sh-on-ve-se-hr-se-br-rs, var(--_ctm-dn-sh-on-ve-se-hr-se-br-rs))
140
190
  );
141
- border-radius: var(--_ctm-dn-sh-on-ve-se-hr-se-br-rs);
191
+ box-shadow: var(
192
+ --_ctm-mob-dn-sh-on-ve-se-hr-se-sw-ae,
193
+ var(
194
+ --_ctm-tab-dn-sh-on-ve-se-hr-se-sw-ae,
195
+ var(--_ctm-dn-sh-on-ve-se-hr-se-sw-ae)
196
+ )
197
+ )
198
+ var(
199
+ --_ctm-mob-dn-sh-on-ve-se-hr-se-sw-br,
200
+ var(
201
+ --_ctm-tab-dn-sh-on-ve-se-hr-se-sw-br,
202
+ var(--_ctm-dn-sh-on-ve-se-hr-se-sw-br)
203
+ )
204
+ )
205
+ var(
206
+ --_ctm-mob-dn-sh-on-ve-se-hr-se-sw-sd,
207
+ var(
208
+ --_ctm-tab-dn-sh-on-ve-se-hr-se-sw-sd,
209
+ var(--_ctm-dn-sh-on-ve-se-hr-se-sw-sd)
210
+ )
211
+ )
212
+ var(
213
+ --_ctm-mob-dn-sh-on-ve-se-hr-se-sw-cr,
214
+ var(
215
+ --_ctm-tab-dn-sh-on-ve-se-hr-se-sw-cr,
216
+ var(--_ctm-dn-sh-on-ve-se-hr-se-sw-cr)
217
+ )
218
+ );
142
219
  }
143
220
  &.selected {
144
221
  width: 45px;
145
222
  border-radius: 20px;
146
223
  outline: 1px solid var(--_gray-300);
147
224
  border: 3px solid #fff;
225
+ border-radius: var(
226
+ --_ctm-mob-dn-sh-on-ve-se-sd-se-br-rs,
227
+ var(--_ctm-tab-dn-sh-on-ve-se-sd-se-br-rs, var(--_ctm-dn-sh-on-ve-se-sd-se-br-rs))
228
+ );
229
+ border: 3px solid #fff;
230
+
148
231
  border-color: var(
149
- --_show-border-im-se,
150
- var(--_ctm-dn-sh-on-ve-se-sd-se-br-cr, var(--_tst-dn-br-cr))
232
+ --_ctm-mob-dn-sh-on-ve-se-sd-se-br-cr,
233
+ var(--_ctm-tab-dn-sh-on-ve-se-sd-se-br-cr, var(--_ctm-dn-sh-on-ve-se-sd-se-br-cr))
151
234
  );
152
235
  border-style: var(
153
- --_show-border-im-se,
154
- var(--_ctm-dn-sh-on-ve-se-sd-se-br-se, var(--_tst-dn-br-se))
236
+ --_ctm-mob-dn-sh-on-ve-se-sd-se-br-se,
237
+ var(--_ctm-tab-dn-sh-on-ve-se-sd-se-br-se, var(--_ctm-dn-sh-on-ve-se-sd-se-br-se))
155
238
  );
156
239
  border-width: var(
157
- --_show-border-im-se,
158
- var(--_ctm-dn-sh-on-ve-se-sd-se-br-wh, var(--_tst-dn-br-wh))
240
+ --_ctm-mob-dn-sh-on-ve-se-sd-se-br-wh,
241
+ var(--_ctm-tab-dn-sh-on-ve-se-sd-se-br-wh, var(--_ctm-dn-sh-on-ve-se-sd-se-br-wh))
159
242
  );
160
- border-radius: var(--_ctm-dn-sh-on-ve-se-sd-se-br-rs, var(--_tst-dn-br-rs));
161
243
  box-shadow: var(
162
- --_show-shadow-im-se,
163
- var(--_ctm-dn-sh-on-ve-se-sd-se-sw-ae, var(--_tst-dn-sw-ae))
164
- var(--_ctm-dn-sh-on-ve-se-sd-se-sw-br, var(--_tst-dn-sw-br))
165
- var(--_ctm-dn-sh-on-ve-se-sd-se-sw-sd, var(--_tst-dn-sw-sd))
166
- var(--_ctm-dn-sh-on-ve-se-sd-se-sw-cr, var(--_tst-dn-sw-cr))
167
- );
168
- border-radius: var(--_ctm-dn-sh-on-ve-se-sd-se-br-rs);
244
+ --_ctm-mob-dn-sh-on-ve-se-sd-se-sw-ae,
245
+ var(
246
+ --_ctm-tab-dn-sh-on-ve-se-sd-se-sw-ae,
247
+ var(--_ctm-dn-sh-on-ve-se-sd-se-sw-ae)
248
+ )
249
+ )
250
+ var(
251
+ --_ctm-mob-dn-sh-on-ve-se-sd-se-sw-br,
252
+ var(
253
+ --_ctm-tab-dn-sh-on-ve-se-sd-se-sw-br,
254
+ var(--_ctm-dn-sh-on-ve-se-sd-se-sw-br)
255
+ )
256
+ )
257
+ var(
258
+ --_ctm-mob-dn-sh-on-ve-se-sd-se-sw-sd,
259
+ var(
260
+ --_ctm-tab-dn-sh-on-ve-se-sd-se-sw-sd,
261
+ var(--_ctm-dn-sh-on-ve-se-sd-se-sw-sd)
262
+ )
263
+ )
264
+ var(
265
+ --_ctm-mob-dn-sh-on-ve-se-sd-se-sw-cr,
266
+ var(
267
+ --_ctm-tab-dn-sh-on-ve-se-sd-se-sw-cr,
268
+ var(--_ctm-dn-sh-on-ve-se-sd-se-sw-cr)
269
+ )
270
+ );
169
271
  }
170
272
  &.disabled {
171
273
  cursor: not-allowed;
@@ -191,8 +293,15 @@
191
293
  color: var(--_gray-500);
192
294
  display: flex;
193
295
  flex-direction: column;
194
- gap: var(--_ctm-lt-on-te-ve-sg);
195
- padding: var(--_ctm-lt-se-st-dy-se-im-pg);
296
+ gap: var(
297
+ --_ctm-mob-lt-on-te-ve-sg,
298
+ var(--_ctm-tab-lt-on-te-ve-sg, var(--_ctm-lt-on-te-ve-sg))
299
+ );
300
+
301
+ padding: var(
302
+ --_ctm-mob-lt-se-st-dy-se-im-pg,
303
+ var(--_ctm-tab-lt-se-st-dy-se-im-pg, var(--_ctm-lt-se-st-dy-se-im-pg))
304
+ );
196
305
  .title {
197
306
  margin-bottom: 4px;
198
307
  }
@@ -202,13 +311,22 @@
202
311
  flex-wrap: wrap;
203
312
  margin-bottom: 10px;
204
313
  flex-direction: row;
205
- gap: var(--_ctm-lt-se-st-dy-se-im-sg);
314
+ gap: var(
315
+ --_ctm-mob-lt-se-st-dy-se-im-sg,
316
+ var(--_ctm-tab-lt-se-st-dy-se-im-sg, var(--_ctm-lt-se-st-dy-se-im-sg))
317
+ );
206
318
  &[data-single-dispaly="Vertically"] {
207
319
  flex-direction: column;
208
320
  }
209
321
  &[data-single-dispaly="Grid"] {
210
322
  display: grid;
211
- grid-template-columns: repeat(var(--_ctm-lt-se-st-dy-se-is-pr-rw), minmax(auto, 1fr));
323
+ grid-template-columns: repeat(
324
+ var(
325
+ --_ctm-mob-lt-se-st-dy-se-is-pr-rw,
326
+ var(--_ctm-tab-lt-se-st-dy-se-is-pr-rw, var(--_ctm-lt-se-st-dy-se-is-pr-rw))
327
+ ),
328
+ minmax(auto, 1fr)
329
+ );
212
330
  }
213
331
  .select__group__item {
214
332
  transition: color 0.3s ease;
@@ -219,50 +337,138 @@
219
337
  font-weight: 600;
220
338
  cursor: pointer;
221
339
  border-color: var(
222
- --_show-border-im-se,
223
- var(--_ctm-dn-se-on-ve-se-dt-se-br-cr, var(--_tst-dn-br-cr))
340
+ --_ctm-mob-dn-se-on-ve-se-dt-se-br-cr,
341
+ var(--_ctm-tab-dn-se-on-ve-se-dt-se-br-cr, var(--_ctm-dn-se-on-ve-se-dt-se-br-cr))
224
342
  );
225
343
  border-style: var(
226
- --_show-border-im-se,
227
- var(--_ctm-dn-se-on-ve-se-dt-se-br-se, var(--_tst-dn-br-se))
344
+ --_ctm-mob-dn-se-on-ve-se-dt-se-br-se,
345
+ var(--_ctm-tab-dn-se-on-ve-se-dt-se-br-se, var(--_ctm-dn-se-on-ve-se-dt-se-br-se))
228
346
  );
229
347
  border-width: var(
230
- --_show-border-im-se,
231
- var(--_ctm-dn-se-on-ve-se-dt-se-br-wh, var(--_tst-dn-br-wh))
348
+ --_ctm-mob-dn-se-on-ve-se-dt-se-br-wh,
349
+ var(--_ctm-tab-dn-se-on-ve-se-dt-se-br-wh, var(--_ctm-dn-se-on-ve-se-dt-se-br-wh))
232
350
  );
233
- border-radius: var(--_ctm-dn-se-on-ve-se-dt-se-br-rs, var(--_tst-dn-br-rs));
234
351
  box-shadow: var(
235
- --_show-shadow-im-se,
236
- var(--_ctm-dn-se-on-ve-se-dt-se-sw-ae, var(--_tst-dn-sw-ae))
237
- var(--_ctm-dn-se-on-ve-se-dt-se-sw-br, var(--_tst-dn-sw-br))
238
- var(--_ctm-dn-se-on-ve-se-dt-se-sw-sd, var(--_tst-dn-sw-sd))
239
- var(--_ctm-dn-se-on-ve-se-dt-se-sw-cr, var(--_tst-dn-sw-cr))
352
+ --_ctm-mob-dn-se-on-ve-se-dt-se-sw-ae,
353
+ var(--_ctm-tab-dn-se-on-ve-se-dt-se-sw-ae, var(--_ctm-dn-se-on-ve-se-dt-se-sw-ae))
354
+ )
355
+ var(
356
+ --_ctm-mob-dn-se-on-ve-se-dt-se-sw-br,
357
+ var(--_ctm-tab-dn-se-on-ve-se-dt-se-sw-br, var(--_ctm-dn-se-on-ve-se-dt-se-sw-br))
358
+ )
359
+ var(
360
+ --_ctm-mob-dn-se-on-ve-se-dt-se-sw-sd,
361
+ var(--_ctm-tab-dn-se-on-ve-se-dt-se-sw-sd, var(--_ctm-dn-se-on-ve-se-dt-se-sw-sd))
362
+ )
363
+ var(
364
+ --_ctm-mob-dn-se-on-ve-se-dt-se-sw-cr,
365
+ var(--_ctm-tab-dn-se-on-ve-se-dt-se-sw-cr, var(--_ctm-dn-se-on-ve-se-dt-se-sw-cr))
366
+ );
367
+ border-radius: var(
368
+ --_ctm-mob-dn-se-on-ve-se-dt-se-br-rs,
369
+ var(--_ctm-tab-dn-se-on-ve-se-dt-se-br-rs, var(--_ctm-dn-se-on-ve-se-dt-se-br-rs))
240
370
  );
241
- border-radius: var(--_ctm-dn-se-on-ve-se-dt-se-br-rs);
242
- background-color: var(--_ctm-dn-se-on-ve-se-dt-se-bd-cr);
243
371
  &:hover {
244
372
  border-color: var(
245
373
  --_show-border-im-se,
246
- var(--_ctm-dn-se-on-ve-se-hr-se-br-cr, var(--_tst-dn-br-cr))
374
+ var(
375
+ --_ctm-mob-dn-se-on-ve-se-hr-se-br-cr,
376
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-br-cr, var(--_ctm-dn-se-on-ve-se-hr-se-br-cr))
377
+ )
247
378
  );
248
379
  border-style: var(
249
380
  --_show-border-im-se,
250
- var(--_ctm-dn-se-on-ve-se-hr-se-br-se, var(--_tst-dn-br-se))
381
+ var(
382
+ --_ctm-mob-dn-se-on-ve-se-hr-se-br-se,
383
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-br-se, var(--_ctm-dn-se-on-ve-se-hr-se-br-se))
384
+ )
251
385
  );
252
386
  border-width: var(
253
387
  --_show-border-im-se,
254
- var(--_ctm-dn-se-on-ve-se-hr-se-br-wh, var(--_tst-dn-br-wh))
388
+ var(
389
+ --_ctm-mob-dn-se-on-ve-se-hr-se-br-wh,
390
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-br-wh, var(--_ctm-dn-se-on-ve-se-hr-se-br-wh))
391
+ )
392
+ );
393
+ border-radius: var(
394
+ --_ctm-mob-dn-se-on-ve-se-hr-se-br-rs,
395
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-br-rs, var(--_ctm-dn-se-on-ve-se-hr-se-br-rs))
255
396
  );
256
- border-radius: var(--_ctm-dn-se-on-ve-se-hr-se-br-rs, var(--_tst-dn-br-rs));
257
397
  box-shadow: var(
258
398
  --_show-shadow-im-se,
259
- var(--_ctm-dn-se-on-ve-se-hr-se-sw-ae, var(--_tst-dn-sw-ae))
260
- var(--_ctm-dn-se-on-ve-se-hr-se-sw-br, var(--_tst-dn-sw-br))
261
- var(--_ctm-dn-se-on-ve-se-hr-se-sw-sd, var(--_tst-dn-sw-sd))
262
- var(--_ctm-dn-se-on-ve-se-hr-se-sw-cr, var(--_tst-dn-sw-cr))
399
+ var(
400
+ --_ctm-mob-dn-se-on-ve-se-hr-se-sw-ae,
401
+ var(
402
+ --_ctm-tab-dn-se-on-ve-se-hr-se-sw-ae,
403
+ var(--_ctm-dn-se-on-ve-se-hr-se-sw-ae)
404
+ )
405
+ )
406
+ var(
407
+ --_ctm-mob-dn-se-on-ve-se-hr-se-sw-br,
408
+ var(
409
+ --_ctm-tab-dn-se-on-ve-se-hr-se-sw-br,
410
+ var(--_ctm-dn-se-on-ve-se-hr-se-sw-br)
411
+ )
412
+ )
413
+ var(
414
+ --_ctm-mob-dn-se-on-ve-se-hr-se-sw-sd,
415
+ var(
416
+ --_ctm-tab-dn-se-on-ve-se-hr-se-sw-sd,
417
+ var(--_ctm-dn-se-on-ve-se-hr-se-sw-sd)
418
+ )
419
+ )
420
+ var(
421
+ --_ctm-mob-dn-se-on-ve-se-hr-se-sw-cr,
422
+ var(
423
+ --_ctm-tab-dn-se-on-ve-se-hr-se-sw-cr,
424
+ var(--_ctm-dn-se-on-ve-se-hr-se-sw-cr)
425
+ )
426
+ )
427
+ );
428
+ background-color: var(
429
+ --_ctm-mob-dn-se-on-ve-se-hr-se-bd-cr,
430
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-bd-cr, var(--_ctm-dn-se-on-ve-se-hr-se-bd-cr))
431
+ );
432
+ color: var(
433
+ --_ctm-mob-dn-se-on-ve-se-hr-se-cr,
434
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-cr, var(--_ctm-dn-se-on-ve-se-hr-se-cr))
435
+ );
436
+ font-family: var(
437
+ --_ctm-mob-dn-se-on-ve-se-hr-se-ft-fy,
438
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-ft-fy, var(--_ctm-dn-se-on-ve-se-hr-se-ft-fy))
439
+ ),
440
+ sans-serif;
441
+ font-size: var(
442
+ --_ctm-mob-dn-se-on-ve-se-hr-se-ft-se,
443
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-ft-se, var(--_ctm-dn-se-on-ve-se-hr-se-ft-se))
444
+ );
445
+ font-weight: var(
446
+ --_ctm-mob-dn-se-on-ve-se-hr-se-ft-wt,
447
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-ft-wt, var(--_ctm-dn-se-on-ve-se-hr-se-ft-wt))
448
+ );
449
+ font-style: var(
450
+ --_ctm-mob-dn-se-on-ve-se-hr-se-ft-se-ic,
451
+ var(
452
+ --_ctm-tab-dn-se-on-ve-se-hr-se-ft-se-ic,
453
+ var(--_ctm-dn-se-on-ve-se-hr-se-ft-se-ic)
454
+ )
455
+ );
456
+ text-align: var(
457
+ --_ctm-mob-dn-se-on-ve-se-hr-se-tt-an,
458
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-tt-an, var(--_ctm-dn-se-on-ve-se-hr-se-tt-an))
459
+ );
460
+ letter-spacing: var(
461
+ --_ctm-mob-dn-se-on-ve-se-hr-se-lr-sg,
462
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-lr-sg, var(--_ctm-dn-se-on-ve-se-hr-se-lr-sg))
463
+ );
464
+ line-height: var(
465
+ --_ctm-mob-dn-se-on-ve-se-hr-se-le-ht,
466
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-le-ht, var(--_ctm-dn-se-on-ve-se-hr-se-le-ht))
467
+ );
468
+ text-decoration: var(
469
+ --_ctm-mob-dn-se-on-ve-se-hr-se-ue,
470
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-ue, var(--_ctm-dn-se-on-ve-se-hr-se-ue))
263
471
  );
264
- border-radius: var(--_ctm-dn-se-on-ve-se-hr-se-br-rs);
265
- background-color: var(--_ctm-dn-se-on-ve-se-hr-se-bd-cr);
266
472
  }
267
473
  &.child {
268
474
  border: 0;
@@ -275,26 +481,104 @@
275
481
  color: var(--_primary-400);
276
482
  border-color: var(
277
483
  --_show-border-im-se,
278
- var(--_ctm-dn-se-on-ve-se-sd-se-br-cr, var(--_tst-dn-br-cr))
484
+ var(
485
+ --_ctm-mob-dn-se-on-ve-se-sd-se-br-cr,
486
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-br-cr, var(--_ctm-dn-se-on-ve-se-sd-se-br-cr))
487
+ )
279
488
  );
280
489
  border-style: var(
281
490
  --_show-border-im-se,
282
- var(--_ctm-dn-se-on-ve-se-sd-se-br-se, var(--_tst-dn-br-se))
491
+ var(
492
+ --_ctm-mob-dn-se-on-ve-se-sd-se-br-se,
493
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-br-se, var(--_ctm-dn-se-on-ve-se-sd-se-br-se))
494
+ )
283
495
  );
284
496
  border-width: var(
285
497
  --_show-border-im-se,
286
- var(--_ctm-dn-se-on-ve-se-sd-se-br-wh, var(--_tst-dn-br-wh))
498
+ var(
499
+ --_ctm-mob-dn-se-on-ve-se-sd-se-br-wh,
500
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-br-wh, var(--_ctm-dn-se-on-ve-se-sd-se-br-wh))
501
+ )
502
+ );
503
+ border-radius: var(
504
+ --_ctm-mob-dn-se-on-ve-se-sd-se-br-rs,
505
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-br-rs, var(--_ctm-dn-se-on-ve-se-sd-se-br-rs))
287
506
  );
288
- border-radius: var(--_ctm-dn-se-on-ve-se-sd-se-br-rs, var(--_tst-dn-br-rs));
289
507
  box-shadow: var(
290
508
  --_show-shadow-im-se,
291
- var(--_ctm-dn-se-on-ve-se-sd-se-sw-ae, var(--_tst-dn-sw-ae))
292
- var(--_ctm-dn-se-on-ve-se-sd-se-sw-br, var(--_tst-dn-sw-br))
293
- var(--_ctm-dn-se-on-ve-se-sd-se-sw-sd, var(--_tst-dn-sw-sd))
294
- var(--_ctm-dn-se-on-ve-se-sd-se-sw-cr, var(--_tst-dn-sw-cr))
509
+ var(
510
+ --_ctm-mob-dn-se-on-ve-se-sd-se-sw-ae,
511
+ var(
512
+ --_ctm-tab-dn-se-on-ve-se-sd-se-sw-ae,
513
+ var(--_ctm-dn-se-on-ve-se-sd-se-sw-ae)
514
+ )
515
+ )
516
+ var(
517
+ --_ctm-mob-dn-se-on-ve-se-sd-se-sw-br,
518
+ var(
519
+ --_ctm-tab-dn-se-on-ve-se-sd-se-sw-br,
520
+ var(--_ctm-dn-se-on-ve-se-sd-se-sw-br)
521
+ )
522
+ )
523
+ var(
524
+ --_ctm-mob-dn-se-on-ve-se-sd-se-sw-sd,
525
+ var(
526
+ --_ctm-tab-dn-se-on-ve-se-sd-se-sw-sd,
527
+ var(--_ctm-dn-se-on-ve-se-sd-se-sw-sd)
528
+ )
529
+ )
530
+ var(
531
+ --_ctm-mob-dn-se-on-ve-se-sd-se-sw-cr,
532
+ var(
533
+ --_ctm-tab-dn-se-on-ve-se-sd-se-sw-cr,
534
+ var(--_ctm-dn-se-on-ve-se-sd-se-sw-cr)
535
+ )
536
+ )
537
+ );
538
+ background-color: var(
539
+ --_ctm-mob-dn-se-on-ve-se-sd-se-bd-cr,
540
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-bd-cr, var(--_ctm-dn-se-on-ve-se-sd-se-bd-cr))
541
+ );
542
+ color: var(
543
+ --_ctm-mob-dn-se-on-ve-se-sd-se-cr,
544
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-cr, var(--_ctm-dn-se-on-ve-se-sd-se-cr))
545
+ );
546
+ font-family: var(
547
+ --_ctm-mob-dn-se-on-ve-se-sd-se-ft-fy,
548
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-ft-fy, var(--_ctm-dn-se-on-ve-se-sd-se-ft-fy))
549
+ ),
550
+ sans-serif;
551
+ font-size: var(
552
+ --_ctm-mob-dn-se-on-ve-se-sd-se-ft-se,
553
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-ft-se, var(--_ctm-dn-se-on-ve-se-sd-se-ft-se))
554
+ );
555
+ font-weight: var(
556
+ --_ctm-mob-dn-se-on-ve-se-sd-se-ft-wt,
557
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-ft-wt, var(--_ctm-dn-se-on-ve-se-sd-se-ft-wt))
558
+ );
559
+ font-style: var(
560
+ --_ctm-mob-dn-se-on-ve-se-sd-se-ft-se-ic,
561
+ var(
562
+ --_ctm-tab-dn-se-on-ve-se-sd-se-ft-se-ic,
563
+ var(--_ctm-dn-se-on-ve-se-sd-se-ft-se-ic)
564
+ )
565
+ );
566
+ text-align: var(
567
+ --_ctm-mob-dn-se-on-ve-se-sd-se-tt-an,
568
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-tt-an, var(--_ctm-dn-se-on-ve-se-sd-se-tt-an))
569
+ );
570
+ letter-spacing: var(
571
+ --_ctm-mob-dn-se-on-ve-se-sd-se-lr-sg,
572
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-lr-sg, var(--_ctm-dn-se-on-ve-se-sd-se-lr-sg))
573
+ );
574
+ line-height: var(
575
+ --_ctm-mob-dn-se-on-ve-se-sd-se-le-ht,
576
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-le-ht, var(--_ctm-dn-se-on-ve-se-sd-se-le-ht))
577
+ );
578
+ text-decoration: var(
579
+ --_ctm-mob-dn-se-on-ve-se-sd-se-ue,
580
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-ue, var(--_ctm-dn-se-on-ve-se-sd-se-ue))
295
581
  );
296
- border-radius: var(--_ctm-dn-se-on-ve-se-sd-se-br-rs);
297
- background-color: var(--_ctm-dn-se-on-ve-se-sd-se-bd-cr);
298
582
  }
299
583
  &.selected__child {
300
584
  border: 0px;
@@ -389,7 +673,13 @@
389
673
  .var__drop__selection {
390
674
  display: flex;
391
675
  width: 100%;
392
- gap: var(--_ctm-lt-dn-dy-se-dn-lt-im-sg);
676
+ gap: var(
677
+ --_ctm-mob-lt-dn-dy-se-dn-lt-im-sg,
678
+ var(
679
+ --_ctm-tab-lt-dn-dy-se-dn-lt-im-sg,
680
+ var(--_ctm-lt-dn-dy-se-dn-lt-im-sg, var(--_ctm-lt-im-sg))
681
+ )
682
+ );
393
683
  flex-direction: row;
394
684
  &[data-dropdown-style="Vertical List"] {
395
685
  flex-direction: column;
@@ -470,8 +760,14 @@
470
760
  .grouped_items {
471
761
  display: flex;
472
762
  flex-direction: column;
473
- gap: var(--_ctm-lt-gd-os-dy-se-gp-sg);
474
- padding: var(--_ctm-lt-gd-os-dy-se-gp-pg);
763
+ gap: var(
764
+ --_ctm-mob-lt-gd-os-dy-se-gp-sg,
765
+ var(--_ctm-tab-lt-gd-os-dy-se-gp-sg, var(--_ctm-lt-gd-os-dy-se-gp-sg))
766
+ );
767
+ padding: var(
768
+ --_ctm-mob-lt-gd-os-dy-se-gp-pg,
769
+ var(--_ctm-tab-lt-gd-os-dy-se-gp-pg, var(--_ctm-lt-gd-os-dy-se-gp-pg))
770
+ );
475
771
  }
476
772
  // tabs
477
773
  .tabs__container {
@@ -549,8 +845,14 @@
549
845
  }
550
846
  // table
551
847
  .table__class {
848
+ display: flex;
849
+ align-items: center;
552
850
  border: 1px solid var(--_gray-200);
553
851
  border-radius: 8px;
852
+ .y-axis-caption {
853
+ writing-mode: vertical-rl; /* Rotate text for vertical display */
854
+ transform: rotate(180deg); /* Flip the text */
855
+ }
554
856
  .custom__table {
555
857
  border: 1px solid var(--_gray-200);
556
858
  width: 100%;
@@ -566,7 +868,11 @@
566
868
  font-weight: 600;
567
869
  color: var(--_gray-600);
568
870
  border-right: 1px solid var(--_gray-200);
569
- height: var(--_ctm-lt-mx-dy-se-hr-ht);
871
+ height: var(
872
+ --_ctm-mob-lt-mx-dy-se-hr-ht,
873
+ var(--_ctm-tab-lt-mx-dy-se-hr-ht, var(--_ctm-lt-mx-dy-se-hr-ht))
874
+ );
875
+
570
876
  word-break: break-word;
571
877
  }
572
878
  }
@@ -622,85 +928,180 @@
622
928
  }
623
929
  .tabs {
624
930
  display: flex;
625
- gap: var(--_ctm-dn-tb-im-se-dt-se-tb-ad-cr-sg);
931
+ gap: var(
932
+ --_ctm-mob-lt-tb-im-se-dt-se-tb-ad-cr-sg,
933
+ var(--_ctm-tab-lt-tb-im-se-dt-se-tb-ad-cr-sg, var(--_ctm-dn-tb-im-se-dt-se-tb-ad-cr-sg))
934
+ );
626
935
 
627
936
  .tabs__container {
628
937
  display: flex;
629
- gap: var(--_ctm-lt-gd-os-dy-se-tb-sg);
938
+ gap: var(
939
+ --_ctm-mob-lt-gd-os-dy-se-tb-sg,
940
+ var(--_ctm-tab-lt-gd-os-dy-se-tb-sg, var(--_ctm-lt-gd-os-dy-se-tb-sg))
941
+ );
630
942
  background-color: var(--_gray-100);
631
943
  .tab {
632
944
  display: flex;
633
945
  justify-content: var(--_tab-aliginment);
634
- padding: var(--_ctm-lt-gd-os-dy-se-tb-vl-pg) var(--_ctm-lt-gd-os-dy-se-tb-hl-pg);
635
- background-color: var(--_ctm-dn-tb-im-se-dt-se-bd-cr);
946
+ padding: var(
947
+ --_ctm-mob-lt-gd-os-dy-se-tb-vl-pg,
948
+ var(--_ctm-tab-lt-gd-os-dy-se-tb-vl-pg, var(--_ctm-lt-gd-os-dy-se-tb-vl-pg))
949
+ )
950
+ var(
951
+ --_ctm-mob-lt-gd-os-dy-se-tb-hl-pg,
952
+ var(--_ctm-tab-lt-gd-os-dy-se-tb-hl-pg, var(--_ctm-lt-gd-os-dy-se-tb-hl-pg))
953
+ );
954
+ background-color: var(
955
+ --_ctm-mob-lt-dn-tb-im-se-dt-se-bd-cr,
956
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-bd-cr, var(--_ctm-dn-tb-im-se-dt-se-bd-cr))
957
+ );
636
958
  border-color: var(
637
959
  --_show-border-im-se,
638
- var(--_ctm-dn-tb-im-se-dt-se-br-cr, var(--_tst-dn-br-cr))
960
+ var(
961
+ --_ctm-mob-lt-dn-tb-im-se-dt-se-br-cr,
962
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-cr, var(--_ctm-dn-tb-im-se-dt-se-br-cr))
963
+ )
639
964
  );
640
965
  border-style: var(
641
966
  --_show-border-im-se,
642
- var(--_ctm-dn-tb-im-se-dt-se-br-se, var(--_tst-dn-br-se))
967
+ var(
968
+ --_ctm-mob-lt-dn-tb-im-se-dt-se-br-se,
969
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-se, var(--_ctm-dn-tb-im-se-dt-se-br-se))
970
+ )
643
971
  );
644
972
  border-width: var(
645
973
  --_show-border-im-se,
646
- var(--_ctm-dn-tb-im-se-dt-se-br-wh, var(--_tst-dn-br-wh))
974
+ var(
975
+ --_ctm-mob-lt-dn-tb-im-se-dt-se-br-wh,
976
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-wh, var(--_ctm-dn-tb-im-se-dt-se-br-wh))
977
+ )
978
+ );
979
+ border-radius: var(
980
+ --_ctm-mob-lt-dn-tb-im-se-dt-se-br-rs,
981
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-rs, var(--_ctm-dn-tb-im-se-dt-se-br-rs))
647
982
  );
648
- border-radius: var(--_ctm-dn-tb-im-se-dt-se-br-rs, var(--_tst-dn-br-rs));
649
983
  box-shadow: var(
650
984
  --_show-shadow-im-se,
651
- var(--_ctm-dn-tb-im-se-dt-se-sw-ae, var(--_tst-dn-sw-ae))
652
- var(--_ctm-dn-tb-im-se-dt-se-sw-br, var(--_tst-dn-sw-br))
653
- var(--_ctm-dn-tb-im-se-dt-se-sw-sd, var(--_tst-dn-sw-sd))
654
- var(--_ctm-dn-tb-im-se-dt-se-sw-cr, var(--_tst-dn-sw-cr))
985
+ var(
986
+ --_ctm-mob-lt-dn-tb-im-se-dt-se-sw-ae,
987
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-sw-ae)
988
+ ),
989
+ var(
990
+ --_ctm-mob-lt-dn-tb-im-se-dt-se-sw-br,
991
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-sw-br)
992
+ ),
993
+ var(
994
+ --_ctm-mob-lt-dn-tb-im-se-dt-se-sw-sd,
995
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-sw-sd)
996
+ ),
997
+ var(
998
+ --_ctm-mob-lt-dn-tb-im-se-dt-se-sw-cr,
999
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-sw-cr)
1000
+ )
1001
+ );
1002
+ border-radius: var(
1003
+ --_ctm-mob-lt-dn-tb-im-se-dt-se-br-rs,
1004
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-rs)
655
1005
  );
656
- border-radius: var(--_ctm-dn-tb-im-se-dt-se-br-rs);
657
1006
  &:hover {
658
- background-color: var(--_ctm-dn-tb-im-se-hr-se-bd-cr);
1007
+ background-color: var(
1008
+ --_ctm-mob-lt-dn-tb-im-se-hr-se-bd-cr,
1009
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-bd-cr, var(--_ctm-dn-tb-im-se-hr-se-bd-cr))
1010
+ );
659
1011
  border-color: var(
660
1012
  --_show-border-im-se,
661
- var(--_ctm-dn-tb-im-se-hr-se-br-cr, var(--_tst-dn-br-cr))
1013
+ var(
1014
+ --_ctm-mob-lt-dn-tb-im-se-hr-se-br-cr,
1015
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-br-cr, var(--_ctm-dn-tb-im-se-hr-se-br-cr))
1016
+ )
662
1017
  );
663
1018
  border-style: var(
664
1019
  --_show-border-im-se,
665
- var(--_ctm-dn-tb-im-se-hr-se-br-se, var(--_tst-dn-br-se))
1020
+ var(
1021
+ --_ctm-mob-lt-dn-tb-im-se-hr-se-br-se,
1022
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-br-se, var(--_ctm-dn-tb-im-se-hr-se-br-se))
1023
+ )
666
1024
  );
667
1025
  border-width: var(
668
1026
  --_show-border-im-se,
669
- var(--_ctm-dn-tb-im-se-hr-se-br-wh, var(--_tst-dn-br-wh))
1027
+ var(
1028
+ --_ctm-mob-lt-dn-tb-im-se-hr-se-br-wh,
1029
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-br-wh, var(--_ctm-dn-tb-im-se-hr-se-br-wh))
1030
+ )
1031
+ );
1032
+ border-radius: var(
1033
+ --_ctm-mob-lt-dn-tb-im-se-hr-se-br-rs,
1034
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-br-rs, var(--_ctm-dn-tb-im-se-hr-se-br-rs))
670
1035
  );
671
- border-radius: var(--_ctm-dn-tb-im-se-hr-se-br-rs, var(--_tst-dn-br-rs));
672
1036
  box-shadow: var(
673
1037
  --_show-shadow-im-se,
674
- var(--_ctm-dn-tb-im-se-hr-se-sw-ae, var(--_tst-dn-sw-ae))
675
- var(--_ctm-dn-tb-im-se-hr-se-sw-br, var(--_tst-dn-sw-br))
676
- var(--_ctm-dn-tb-im-se-hr-se-sw-sd, var(--_tst-dn-sw-sd))
677
- var(--_ctm-dn-tb-im-se-hr-se-sw-cr, var(--_tst-dn-sw-cr))
1038
+ var(
1039
+ --_ctm-mob-lt-dn-tb-im-se-hr-se-sw-ae,
1040
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-sw-ae)
1041
+ ),
1042
+ var(
1043
+ --_ctm-mob-lt-dn-tb-im-se-hr-se-sw-br,
1044
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-sw-br)
1045
+ ),
1046
+ var(
1047
+ --_ctm-mob-lt-dn-tb-im-se-hr-se-sw-sd,
1048
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-sw-sd)
1049
+ ),
1050
+ var(
1051
+ --_ctm-mob-lt-dn-tb-im-se-hr-se-sw-cr,
1052
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-sw-cr)
1053
+ )
678
1054
  );
679
- border-radius: var(--_ctm-dn-tb-im-se-hr-se-br-rs);
680
1055
  }
681
1056
  &.active {
682
- background-color: var(--_ctm-dn-tb-im-se-sd-se-bd-cr);
1057
+ background-color: var(
1058
+ --_ctm-mob-lt-dn-tb-im-se-sd-se-bd-cr,
1059
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-bd-cr, var(--_ctm-dn-tb-im-se-sd-se-bd-cr))
1060
+ );
683
1061
  border-color: var(
684
1062
  --_show-border-im-se,
685
- var(--_ctm-dn-tb-im-se-sd-se-br-cr, var(--_tst-dn-br-cr))
1063
+ var(
1064
+ --_ctm-mob-lt-dn-tb-im-se-sd-se-br-cr,
1065
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-br-cr, var(--_ctm-dn-tb-im-se-sd-se-br-cr))
1066
+ )
686
1067
  );
687
1068
  border-style: var(
688
1069
  --_show-border-im-se,
689
- var(--_ctm-dn-tb-im-se-sd-se-br-se, var(--_tst-dn-br-se))
1070
+ var(
1071
+ --_ctm-mob-lt-dn-tb-im-se-sd-se-br-se,
1072
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-br-se, var(--_ctm-dn-tb-im-se-sd-se-br-se))
1073
+ )
690
1074
  );
691
1075
  border-width: var(
692
1076
  --_show-border-im-se,
693
- var(--_ctm-dn-tb-im-se-sd-se-br-wh, var(--_tst-dn-br-wh))
1077
+ var(
1078
+ --_ctm-mob-lt-dn-tb-im-se-sd-se-br-wh,
1079
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-br-wh, var(--_ctm-dn-tb-im-se-sd-se-br-wh))
1080
+ )
1081
+ );
1082
+ border-radius: var(
1083
+ --_ctm-mob-lt-dn-tb-im-se-sd-se-br-rs,
1084
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-br-rs, var(--_ctm-dn-tb-im-se-sd-se-br-rs))
694
1085
  );
695
- border-radius: var(--_ctm-dn-tb-im-se-sd-se-br-rs, var(--_tst-dn-br-rs));
696
1086
  box-shadow: var(
697
1087
  --_show-shadow-im-se,
698
- var(--_ctm-dn-tb-im-se-sd-se-sw-ae, var(--_tst-dn-sw-ae))
699
- var(--_ctm-dn-tb-im-se-sd-se-sw-br, var(--_tst-dn-sw-br))
700
- var(--_ctm-dn-tb-im-se-sd-se-sw-sd, var(--_tst-dn-sw-sd))
701
- var(--_ctm-dn-tb-im-se-sd-se-sw-cr, var(--_tst-dn-sw-cr))
1088
+ var(
1089
+ --_ctm-mob-lt-dn-tb-im-se-sd-se-sw-ae,
1090
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-sw-ae)
1091
+ ),
1092
+ var(
1093
+ --_ctm-mob-lt-dn-tb-im-se-sd-se-sw-br,
1094
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-sw-br)
1095
+ ),
1096
+ var(
1097
+ --_ctm-mob-lt-dn-tb-im-se-sd-se-sw-sd,
1098
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-sw-sd)
1099
+ ),
1100
+ var(
1101
+ --_ctm-mob-lt-dn-tb-im-se-sd-se-sw-cr,
1102
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-sw-cr)
1103
+ )
702
1104
  );
703
- border-radius: var(--_ctm-dn-tb-im-se-sd-se-br-rs);
704
1105
  }
705
1106
  // span {
706
1107
  // &.active {
@@ -710,7 +1111,10 @@
710
1111
  }
711
1112
  }
712
1113
  .tab__content {
713
- padding: var(--_ctm-lt-gd-os-dy-se-cr-pg);
1114
+ padding: var(
1115
+ --_ctm-mob-lt-gd-os-dy-se-cr-pg,
1116
+ var(--_ctm-tab-lt-gd-os-dy-se-cr-pg, var(--_ctm-lt-gd-os-dy-se-cr-pg))
1117
+ );
714
1118
  }
715
1119
  }
716
1120
  }