@sc-360-v2/storefront-cms-library 0.3.46 → 0.3.47

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 (21) hide show
  1. package/dist/add-products-tab copy.scss +1131 -0
  2. package/dist/allocationDetails.scss +2020 -479
  3. package/dist/allocations.scss +984 -166
  4. package/dist/builder.js +1 -1
  5. package/dist/button.scss +2 -8
  6. package/dist/cartAttributes.scss +705 -344
  7. package/dist/cartDropdownOverlay.scss +0 -1
  8. package/dist/customization-tree.scss +42 -26
  9. package/dist/gallery-slider-temp.scss +85 -83
  10. package/dist/image-temp.scss +2 -1
  11. package/dist/language-selector.scss +3 -1
  12. package/dist/modal.scss +2 -1
  13. package/dist/prefix-list.scss +1 -1
  14. package/dist/product-image.scss +93 -84
  15. package/dist/quota-details.scss +265 -0
  16. package/dist/shipping-payments.scss +1578 -0
  17. package/dist/theme-classes.scss +296 -0
  18. package/dist/types/builder/tools/element-edit/allocationDetails.d.ts +2 -1
  19. package/dist/types/builder/tools/element-edit/cartAttributes.d.ts +4 -0
  20. package/dist/widget.scss +2 -2
  21. package/package.json +1 -1
package/dist/cartAttributes.scss CHANGED
@@ -25,7 +25,7 @@
25
25
  display: flex;
26
26
  align-items: center;
27
27
  justify-content: center;
28
- min-width: 280px;
28
+ min-width: 100%;
29
29
  max-width: 100%;
30
30
  height: auto;
31
31
  }
@@ -37,286 +37,410 @@
37
37
  gap: 8px;
38
38
  }
39
39
  .cart-attribute-container {
40
+ width: 100%;
40
41
  display: flex;
41
42
  flex-direction: column;
42
- gap: 20px;
43
- background-color: var(--_ctm-dn-ct-as-cr-bd-cr);
44
- margin: var(--_ctm-dn-ct-as-cr-mn);
45
- padding: var(--_ctm-lt-pg);
46
- border-color: var(--_ctm-dn-ct-as-cr-br-cr);
47
- border-style: var(--_ctm-dn-ct-as-cr-br-se);
48
- border-width: var(--_ctm-dn-ct-as-cr-br-wh);
49
- border-radius: var(--_ctm-dn-ct-as-cr-br-rs);
50
- // box-shadow: var();
43
+ background-color: var(
44
+ --_ctm-mob-dn-as-wt-bd-cr,
45
+ var(--_ctm-tab-dn-as-wt-bd-cr, var(--_ctm-dn-as-wt-bd-cr))
46
+ );
47
+ padding: var(--_ctm-mob-dn-as-wt-pg, var(--_ctm-tab-dn-as-wt-pg, var(--_ctm-dn-as-wt-pg)));
48
+ border-color: var(
49
+ --_ctm-mob-dn-as-wt-br-cr,
50
+ var(--_ctm-tab-dn-as-wt-br-cr, var(--_ctm-dn-as-wt-br-cr))
51
+ );
52
+ border-style: var(
53
+ --_ctm-mob-dn-as-wt-br-se,
54
+ var(--_ctm-tab-dn-as-wt-br-se, var(--_ctm-dn-as-wt-br-se))
55
+ );
56
+ border-width: var(
57
+ --_ctm-mob-dn-as-wt-br-wh,
58
+ var(--_ctm-tab-dn-as-wt-br-wh, var(--_ctm-dn-as-wt-br-wh))
59
+ );
60
+ border-radius: var(
61
+ --_ctm-mob-dn-as-wt-br-rs,
62
+ var(--_ctm-tab-dn-as-wt-br-rs, var(--_ctm-dn-as-wt-br-rs))
63
+ );
64
+ box-shadow: var(
65
+ --_ctm-mob-dn-as-wt-sw-ae,
66
+ var(--_ctm-tab-dn-as-wt-sw-ae, var(--_ctm-dn-as-wt-sw-ae))
67
+ )
68
+ var(
69
+ --_ctm-mob-dn--as-wt-sw-br,
70
+ var(--_ctm-tab-dn--as-wt-sw-br, var(--_ctm-dn--as-wt-sw-br))
71
+ )
72
+ var(--_ctm-mob-dn-as-wt-sw-sd, var(--_ctm-tab-dn-as-wt-sw-sd, var(--_ctm-dn-as-wt-sw-sd)))
73
+ var(--_ctm-mob-dn-as-wt-sw-cr, var(--_ctm-tab-dn-as-wt-sw-cr, var(--_ctm-dn-as-wt-sw-cr)));
51
74
  }
52
- .cart-attribute-title {
53
- color: var(--_ctm-dn-ct-as-hr-cr);
54
- font-family: var(--_ctm-dn-ct-as-hr-ft-fy);
55
- font-size: var(--_ctm-dn-ct-as-hr-ft-se);
56
- font-weight: var(--_ctm-dn-ct-as-hr-ft-wt);
57
- font-style: var(--_ctm-dn-ct-as-hr-ft-se-ic);
58
- text-align: var(--_ctm-dn-ct-as-hr-tt-an);
59
- letter-spacing: var(--_ctm-dn-ct-as-hr-lr-sg);
60
- line-height: var(--_ctm-dn-ct-as-hr-le-ht);
61
- text-decoration: var(--_ctm-dn-ct-as-hr-ue);
62
- background-color: var(--_ctm-dn-ct-as-hr-bd-cr);
63
- padding: var(--_ctm-dn-ct-as-hr-pg);
64
- margin: var(--_ctm-dn-ct-as-hr-mn);
65
- border-color: var(--_ctm-dn-ct-as-hr-br-cr);
66
- border-style: var(--_ctm-dn-ct-as-hr-br-se);
67
- border-width: var(--_ctm-dn-ct-as-hr-br-wh);
68
- border-radius: var(--_ctm-dn-ct-as-hr-br-rs);
69
- // box-shadow: var();
75
+ .cart-attribute-header {
76
+ display: flex;
77
+ justify-content: space-between;
78
+ align-items: center;
79
+ background-color: var(
80
+ --_ctm-mob-dn-as-hr-bd-cr,
81
+ var(--_ctm-tab-dn-as-hr-bd-cr, var(--_ctm-dn-as-hr-bd-cr))
82
+ );
83
+ padding: var(--_ctm-mob-dn-as-hr-pg, var(--_ctm-tab-dn-as-hr-pg, var(--_ctm-dn-as-hr-pg)));
84
+ border-color: var(
85
+ --_ctm-mob-dn-as-hr-br-cr,
86
+ var(--_ctm-tab-dn-as-hr-br-cr, var(--_ctm-dn-as-hr-br-cr))
87
+ );
88
+ border-style: var(
89
+ --_ctm-mob-dn-as-hr-br-se,
90
+ var(--_ctm-tab-dn-as-hr-br-se, var(--_ctm-dn-as-hr-br-se))
91
+ );
92
+ border-width: var(
93
+ --_ctm-mob-dn-as-hr-br-wh,
94
+ var(--_ctm-tab-dn-as-hr-br-wh, var(--_ctm-dn-as-hr-br-wh))
95
+ );
96
+ border-radius: var(
97
+ --_ctm-mob-dn-as-hr-br-rs,
98
+ var(--_ctm-tab-dn-as-hr-br-rs, var(--_ctm-dn-as-hr-br-rs))
99
+ );
100
+ .cart_attribute_title {
101
+ font-family: var(
102
+ --_ctm-mob-dn-as-hr-ft-fy,
103
+ var(--_ctm-tab-dn-as-hr-ft-fy, var(--_ctm-dn-as-hr-ft-fy))
104
+ );
105
+ color: var(--_ctm-mob-dn-as-hr-cr, var(--_ctm-tab-dn-as-hr-cr, var(--_ctm-dn-as-hr-cr)));
106
+ font-weight: var(
107
+ --_ctm-mob-dn-as-hr-ft-wt,
108
+ var(--_ctm-tab-dn-as-hr-ft-wt, var(--_ctm-dn-as-hr-ft-wt))
109
+ );
110
+ font-size: var(
111
+ --_ctm-mob-dn-as-hr-ft-se,
112
+ var(--_ctm-tab-dn-as-hr-ft-se, var(--_ctm-dn-as-hr-ft-se))
113
+ );
114
+ text-decoration: var(
115
+ --_ctm-mob-dn-as-hr-ue,
116
+ var(--_ctm-tab-dn-as-hr-ue, var(--_ctm-dn-as-hr-ue))
117
+ );
118
+ letter-spacing: var(
119
+ --_ctm-mob-dn-as-hr-lr-sg,
120
+ var(--_ctm-tab-dn-as-hr-lr-sg, var(--_ctm-dn-as-hr-lr-sg))
121
+ );
122
+ line-height: var(
123
+ --_ctm-mob-dn-as-hr-le-ht,
124
+ var(--_ctm-tab-dn-as-hr-le-ht, var(--_ctm-dn-as-hr-le-ht))
125
+ );
126
+ font-style: var(
127
+ --_ctm-mob-dn-as-hr-ft-se-ic,
128
+ var(--_ctm-tab-dn-as-hr-ft-se-ic, var(--_ctm-dn-as-hr-ft-se-ic))
129
+ );
130
+ text-align: var(
131
+ --_ctm-mob-dn-as-hr-tt-an,
132
+ var(--_ctm-tab-dn-as-hr-tt-an, var(--_ctm-dn-as-hr-tt-an))
133
+ );
134
+ }
135
+ .icon svg {
136
+ path {
137
+ stroke: var(
138
+ --_ctm-mob-dn-an-as-im-in-c1,
139
+ var(--_ctm-tab-dn-an-as-im-in-c1, var(--_ctm-dn-an-as-im-in-c1))
140
+ );
141
+ }
142
+ width: var(
143
+ --_ctm-mob-dn-an-as-im-in-se,
144
+ var(--_ctm-tab-dn-an-as-im-in-se, var(--_ctm-dn-an-as-im-in-se))
145
+ );
146
+ height: var(
147
+ --_ctm-mob-dn-an-as-im-in-se,
148
+ var(--_ctm-tab-dn-an-as-im-in-se, var(--_ctm-dn-an-as-im-in-se))
149
+ );
150
+ }
151
+
152
+ .iconDesc svg {
153
+ path {
154
+ stroke: var(
155
+ --_ctm-mob-dn-an-as-im-in-c1-dc,
156
+ var(--_ctm-tab-dn-an-as-im-in-c1-dc, var(--_ctm-dn-an-as-im-in-c1-dc))
157
+ );
158
+ }
159
+ width: var(
160
+ --_ctm-mob-dn-an-as-im-in-se-dc,
161
+ var(--_ctm-tab-dn-an-as-im-in-se-dc, var(--_ctm-dn-an-as-im-in-se-dc))
162
+ );
163
+ height: var(
164
+ --_ctm-mob-dn-an-as-im-in-se-dc,
165
+ var(--_ctm-tab-dn-an-as-im-in-se-dc, var(--_ctm-dn-an-as-im-in-se-dc))
166
+ );
167
+ }
70
168
  }
71
169
  .attributes-section-body {
72
- padding: 0;
73
170
  width: 100%;
74
171
  display: flex;
75
172
  flex-wrap: wrap;
76
- gap: 16px;
77
- margin-top: 20px;
78
- // max-height: 500px;
79
173
  overflow-y: auto;
80
- padding: 2px;
174
+ background-color: var(
175
+ --_ctm-mob-dn-as-cr-ae-is-wr-bd-cr,
176
+ var(--_ctm-tab-dn-as-cr-ae-is-wr-bd-cr, var(--_ctm-dn-as-cr-ae-is-wr-bd-cr))
177
+ );
178
+ padding: var(
179
+ --_ctm-mob-dn-as-cr-ae-is-wr-pg,
180
+ var(--_ctm-tab-dn-as-cr-ae-is-wr-pg, var(--_ctm-dn-as-cr-ae-is-wr-pg))
181
+ );
182
+ gap: var(
183
+ --_ctm-mob-dn-as-cr-ae-is-wr-im-gp,
184
+ var(--_ctm-tab-dn-as-cr-ae-is-wr-im-gp, var(--_ctm-dn-as-cr-ae-is-wr-im-gp))
185
+ );
186
+ border-color: var(
187
+ --_ctm-mob-dn-as-cr-ae-is-wr-br-cr,
188
+ var(--_ctm-tab-dn-as-cr-ae-is-wr-br-cr, var(--_ctm-dn-as-cr-ae-is-wr-br-cr))
189
+ );
190
+ border-style: var(
191
+ --_ctm-mob-dn-as-cr-ae-is-wr-br-se,
192
+ var(--_ctm-tab-dn-as-cr-ae-is-wr-br-se, var(--_ctm-dn-as-cr-ae-is-wr-br-se))
193
+ );
194
+ border-width: var(
195
+ --_ctm-mob-dn-as-cr-ae-is-wr-br-wh,
196
+ var(--_ctm-tab-dn-as-cr-ae-is-wr-br-wh, var(--_ctm-dn-as-cr-ae-is-wr-br-wh))
197
+ );
198
+ border-radius: var(
199
+ --_ctm-mob-dn-as-cr-ae-is-wr-br-rs,
200
+ var(--_ctm-tab-dn-as-cr-ae-is-wr-br-rs, var(--_ctm-dn-as-cr-ae-is-wr-br-rs))
201
+ );
202
+ .attriTitle {
203
+ font-weight: 600;
204
+ font-size: 14px;
205
+ line-height: 20px;
206
+ color: #101828;
207
+ padding-bottom: 6px;
208
+ }
209
+ .attriDes {
210
+ font-weight: 400;
211
+ font-size: 14px;
212
+ line-height: 20px;
213
+ }
81
214
  .attribute {
82
215
  width: 100%;
83
216
  display: flex;
84
217
  flex-direction: column;
85
- gap: 6px;
218
+ padding: var(
219
+ --_ctm-mob-dn-as-cr-as-fs-pg,
220
+ var(--_ctm-tab-dn-as-cr-as-fs-pg, var(--_ctm-dn-as-cr-as-fs-pg))
221
+ );
222
+ gap: var(
223
+ --_ctm-mob-dn-as-cr-as-fs-im-gp,
224
+ var(--_ctm-tab-dn-as-cr-as-fs-im-gp, var(--_ctm-dn-as-cr-as-fs-im-gp))
225
+ );
86
226
  .label {
87
- // display: block;
88
- // font-size: var(--_ctm-dn-ct-as-is-ll-ft-se);
89
- // font-weight: var(--_ctm-dn-ct-as-is-ll-ft-wt);
90
- // color: var(--_ctm-dn-ct-as-is-ll-cr);
91
- // margin-bottom: 0.5rem;
92
- // letter-spacing: var(--_ctm-dn-ct-as-is-ll-lr-sg);
93
- // line-height: var(--_ctm-dn-ct-as-is-ll-le-ht);
94
- color: var(--Gray-700, #344054);
95
- font-size: 14px;
96
- font-weight: 500;
97
- line-height: 20px;
98
227
  display: block;
228
+ padding: var(
229
+ --_ctm-mob-dn-as-cr-as-ls-pg,
230
+ var(--_ctm-tab-dn-as-cr-as-ls-pg, var(--_ctm-dn-as-cr-as-ls-pg))
231
+ );
232
+ font-family: var(
233
+ --_ctm-mob-dn-as-cr-as-ls-ft-fy,
234
+ var(--_ctm-tab-dn-as-cr-as-ls-ft-fy, var(--_ctm-dn-as-cr-as-ls-ft-fy))
235
+ );
236
+ color: var(
237
+ --_ctm-mob-dn-as-cr-as-ls-cr,
238
+ var(--_ctm-tab-dn-as-cr-as-ls-cr, var(--_ctm-dn-as-cr-as-ls-cr))
239
+ );
240
+ font-weight: var(
241
+ --_ctm-mob-dn-as-cr-as-ls-ft-wt,
242
+ var(--_ctm-tab-dn-as-cr-as-ls-ft-wt, var(--_ctm-dn-as-cr-as-ls-ft-wt))
243
+ );
244
+ font-size: var(
245
+ --_ctm-mob-dn-as-cr-as-ls-ft-se,
246
+ var(--_ctm-tab-dn-as-cr-as-ls-ft-se, var(--_ctm-dn-as-cr-as-ls-ft-se))
247
+ );
248
+ text-decoration: var(
249
+ --_ctm-mob-dn-as-cr-as-ls-ue,
250
+ var(--_ctm-tab-dn-as-cr-as-ls-ue, var(--_ctm-dn-as-cr-as-ls-ue))
251
+ );
252
+ letter-spacing: var(
253
+ --_ctm-mob-dn-as-cr-as-ls-lr-sg,
254
+ var(--_ctm-tab-dn-as-cr-as-ls-lr-sg, var(--_ctm-dn-as-cr-as-ls-lr-sg))
255
+ );
256
+ line-height: var(
257
+ --_ctm-mob-dn-as-cr-as-ls-le-ht,
258
+ var(--_ctm-tab-dn-as-cr-as-ls-le-ht, var(--_ctm-dn-as-cr-as-ls-le-ht))
259
+ );
260
+ font-style: var(
261
+ --_ctm-mob-dn-as-cr-as-ls-ft-se-ic,
262
+ var(--_ctm-tab-dn-as-cr-as-ls-ft-se-ic, var(--_ctm-dn-as-cr-as-ls-ft-se-ic))
263
+ );
264
+ text-align: var(
265
+ --_ctm-mob-dn-as-cr-as-ls-tt-an,
266
+ var(--_ctm-tab-dn-as-cr-as-ls-tt-an, var(--_ctm-dn-as-cr-as-ls-tt-an))
267
+ );
99
268
  &.required::after {
100
269
  content: " *";
101
270
  color: var(--_error-500);
102
-
103
- [data-div-type="element"] {
104
- &[data-element-type="cartAttributes"] {
105
- // width: var(
106
- // --_ctm-mob-ele-nw-wh-st-mx,
107
- // var(
108
- // --_ctm-tab-ele-nw-wh-st-mx,
109
- // var(--_sf-el-wh-st-mx, calc(1% * var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))))
110
- // )
111
- // );
112
-
113
- // margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));
114
-
115
- height: max-content;
116
- min-width: 240px;
117
-
118
- // aspect-ratio: var(
119
- // --_ctm-mob-aspect-ratio,
120
- // var(--_ctm-tab-aspect-ratio, var(--_sf-aspect-ratio))
121
- // );
122
-
123
- & > .wrapper {
124
- display: flex;
125
- align-items: center;
126
- justify-content: center;
127
- width: 100%;
128
- height: auto;
129
- }
130
-
131
- .cart__section {
132
- display: flex;
133
- align-items: center;
134
- cursor: pointer;
135
- gap: 8px;
136
- }
137
- .cart-attribute-container {
138
- display: flex;
139
- flex-direction: column;
140
- gap: 20px;
141
- background-color: var(--_ctm-dn-ct-as-cr-bd-cr);
142
- margin: var(--_ctm-dn-ct-as-cr-mn);
143
- padding: var(--_ctm-lt-pg);
144
- border-color: var(--_ctm-dn-ct-as-cr-br-cr);
145
- border-style: var(--_ctm-dn-ct-as-cr-br-se);
146
- border-width: var(--_ctm-dn-ct-as-cr-br-wh);
147
- border-radius: var(--_ctm-dn-ct-as-cr-br-rs);
148
- // box-shadow: var();
149
- }
150
- .cart-attribute-title {
151
- color: var(--_ctm-dn-ct-as-hr-cr);
152
- font-family: var(--_ctm-dn-ct-as-hr-ft-fy);
153
- font-size: var(--_ctm-dn-ct-as-hr-ft-se);
154
- font-weight: var(--_ctm-dn-ct-as-hr-ft-wt);
155
- font-style: var(--_ctm-dn-ct-as-hr-ft-se-ic);
156
- text-align: var(--_ctm-dn-ct-as-hr-tt-an);
157
- letter-spacing: var(--_ctm-dn-ct-as-hr-lr-sg);
158
- line-height: var(--_ctm-dn-ct-as-hr-le-ht);
159
- text-decoration: var(--_ctm-dn-ct-as-hr-ue);
160
- background-color: var(--_ctm-dn-ct-as-hr-bd-cr);
161
- padding: var(--_ctm-dn-ct-as-hr-pg);
162
- margin: var(--_ctm-dn-ct-as-hr-mn);
163
- border-color: var(--_ctm-dn-ct-as-hr-br-cr);
164
- border-style: var(--_ctm-dn-ct-as-hr-br-se);
165
- border-width: var(--_ctm-dn-ct-as-hr-br-wh);
166
- border-radius: var(--_ctm-dn-ct-as-hr-br-rs);
167
- // box-shadow: var();
168
- }
169
- .attributes-section-body {
170
- padding: 0;
171
- width: 100%;
172
- display: flex;
173
- flex-wrap: wrap;
174
- gap: 16px;
175
- margin-top: 20px;
176
- .attribute {
177
- width: 100%;
178
- .label {
179
- display: block;
180
- font-size: var(--_ctm-dn-ct-as-is-ll-ft-se);
181
- font-weight: var(--_ctm-dn-ct-as-is-ll-ft-wt);
182
- color: var(--_ctm-dn-ct-as-is-ll-cr);
183
- margin-bottom: 0.5rem;
184
- letter-spacing: var(--_ctm-dn-ct-as-is-ll-lr-sg);
185
- line-height: var(--_ctm-dn-ct-as-is-ll-le-ht);
186
- margin-bottom: 10px;
187
- &.required::after {
188
- content: " *";
189
- color: var(--_error-500);
190
- }
191
- }
192
- }
193
- .error-text {
194
- font-size: 12px;
195
- color: var(--_error-500);
196
- }
197
- .attribute_field {
198
- width: 100%;
199
- .attribute_form_field {
200
- width: 100%;
201
- }
202
-
203
- .attribute_form_field {
204
- width: 100% !important;
205
- padding: 12px;
206
- border-radius: var(--_ctm-dn-ct-as-is-fd-br-rs);
207
- border-style: var(--_ctm-dn-ct-as-is-fd-br-se);
208
- border-width: var(--_ctm-dn-ct-as-is-fd-br-wh);
209
- border-color: var(--_ctm-dn-ct-as-is-fd-br-cr);
210
- outline: none;
211
- transition: border-color 0.2s ease-in-out;
212
- font-size: 14px;
213
- height: 40px;
214
-
215
- &:focus {
216
- border-color: var(--_primary-400);
217
- outline: 2px solid var(--_primary-200);
218
- }
219
- &.error {
220
- border-color: #dc2626;
221
- background-color: #fef2f2;
222
- }
223
- .react-datepicker-wrapper {
224
- width: 100%;
225
- .react-datepicker__close-icon::after {
226
- background-color: transparent;
227
- font-size: 25px;
228
- color: var(--_gray-500);
229
- }
230
- }
231
- }
232
-
233
- textarea {
234
- min-height: 100px;
235
- resize: vertical;
236
- }
237
- }
238
- .text_area_attribute {
239
- width: 100%;
240
- .input_textarea_a {
241
- width: 100%;
242
- }
243
- }
244
- .cart_item_attr_disabled {
245
- pointer-events: none;
246
- opacity: 0.5;
247
- cursor: auto;
248
- }
249
- }
250
- }
251
- }
252
-
253
- .custom-upload {
254
- text-align: center;
255
- border: 1px solid var(--_gray-200);
256
- border-radius: 6px;
257
- padding: 16px;
258
- &:hover {
259
- cursor: pointer;
260
- border: 1px solid var(--_primary-200);
261
- background: var(--_primary-25);
262
- }
263
- .uploadicon {
264
- padding: 10px;
265
- background: #f2f4f7;
266
- display: inline-block;
267
- border-radius: 50%;
268
- margin-bottom: 12px;
269
- color: var(--_gray-600);
270
- }
271
- p {
272
- padding-bottom: 4px;
273
- color: var(--_gray-600);
274
- font-size: 14px;
275
- strong {
276
- color: var(--_primary-400);
277
- font-weight: 600;
278
- }
279
- }
280
- span {
281
- color: var(--_gray-600);
282
- font-size: 12px;
283
- }
284
- }
285
271
  }
286
272
  }
287
- }
288
- .error-text {
289
- font-size: 12px;
290
- color: var(--_error-500);
291
- }
292
- .attribute_field {
293
- width: 100%;
294
- .react-datepicker-wrapper {
295
- width: 100%;
296
- }
297
-
298
- .attribute_form_field {
299
- width: 100%;
300
- }
301
-
302
- .attribute_form_field {
273
+ .attribute_field {
303
274
  width: 100% !important;
304
- padding: 12px;
305
- border-radius: 4px;
306
- border: 1px solid var(--Gray-300, #d0d5dd);
307
- background: var(--Base-White, #fff);
308
- color: var(--Gray-700, #344054);
309
- /* Shadow/xs */
310
- box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
311
- // border-radius: var(--_ctm-dn-ct-as-is-fd-br-rs);
312
- // border-style: var(--_ctm-dn-ct-as-is-fd-br-se);
313
- // border-width: var(--_ctm-dn-ct-as-is-fd-br-wh);
314
- // border-color: var(--_ctm-dn-ct-as-is-fd-br-cr);
315
- outline: none;
316
- transition: border-color 0.2s ease-in-out;
317
- font-size: 14px;
318
- height: 40px;
319
-
275
+ input {
276
+ background-color: var(
277
+ --_ctm-mob-dn-as-cr-as-is-bd-cr,
278
+ var(--_ctm-tab-dn-as-cr-as-is-bd-cr, var(--_ctm-dn-as-cr-as-is-bd-cr))
279
+ );
280
+ padding: var(
281
+ --_ctm-mob-dn-as-cr-as-is-pg,
282
+ var(--_ctm-tab-dn-as-cr-as-is-pg, var(--_ctm-dn-as-cr-as-is-pg))
283
+ );
284
+ gap: var(
285
+ --_ctm-mob-dn-as-cr-as-is-im-gp,
286
+ var(--_ctm-tab-dn-as-cr-as-is-im-gp, var(--_ctm-dn-as-cr-as-is-im-gp))
287
+ );
288
+ border-color: var(
289
+ --_ctm-mob-dn-as-cr-as-is-br-cr,
290
+ var(--_ctm-tab-dn-as-cr-as-is-br-cr, var(--_ctm-dn-as-cr-as-is-br-cr))
291
+ );
292
+ border-style: var(
293
+ --_ctm-mob-dn-as-cr-as-is-br-se,
294
+ var(--_ctm-tab-dn-as-cr-as-is-br-se, var(--_ctm-dn-as-cr-as-is-br-se))
295
+ );
296
+ border-width: var(
297
+ --_ctm-mob-dn-as-cr-as-is-br-wh,
298
+ var(--_ctm-tab-dn-as-cr-as-is-br-wh, var(--_ctm-dn-as-cr-as-is-br-wh))
299
+ );
300
+ border-radius: var(
301
+ --_ctm-mob-dn-as-cr-as-is-br-rs,
302
+ var(--_ctm-tab-dn-as-cr-as-is-br-rs, var(--_ctm-dn-as-cr-as-is-br-rs))
303
+ );
304
+ &::placeholder {
305
+ font-family: var(
306
+ --_ctm-mob-dn-as-cr-as-is-ft-fy,
307
+ var(--_ctm-tab-dn-as-cr-as-is-ft-fy, var(--_ctm-dn-as-cr-as-is-ft-fy))
308
+ );
309
+ color: var(
310
+ --_ctm-mob-dn-as-cr-as-is-cr,
311
+ var(--_ctm-tab-dn-as-cr-as-is-cr, var(--_ctm-dn-as-cr-as-is-cr))
312
+ );
313
+ font-weight: var(
314
+ --_ctm-mob-dn-as-cr-as-is-ft-wt,
315
+ var(--_ctm-tab-dn-as-cr-as-is-ft-wt, var(--_ctm-dn-as-cr-as-is-ft-wt))
316
+ );
317
+ font-size: var(
318
+ --_ctm-mob-dn-as-cr-as-is-ft-se,
319
+ var(--_ctm-tab-dn-as-cr-as-is-ft-se, var(--_ctm-dn-as-cr-as-is-ft-se))
320
+ );
321
+ text-decoration: var(
322
+ --_ctm-mob-dn-as-cr-as-is-ue,
323
+ var(--_ctm-tab-dn-as-cr-as-is-ue, var(--_ctm-dn-as-cr-as-is-ue))
324
+ );
325
+ letter-spacing: var(
326
+ --_ctm-mob-dn-as-cr-as-is-lr-sg,
327
+ var(--_ctm-tab-dn-as-cr-as-is-lr-sg, var(--_ctm-dn-as-cr-as-is-lr-sg))
328
+ );
329
+ line-height: var(
330
+ --_ctm-mob-dn-as-cr-as-is-le-ht,
331
+ var(--_ctm-tab-dn-as-cr-as-is-le-ht, var(--_ctm-dn-as-cr-as-is-le-ht))
332
+ );
333
+ font-style: var(
334
+ --_ctm-mob-dn-as-cr-as-is-ft-se-ic,
335
+ var(--_ctm-tab-dn-as-cr-as-is-ft-se-ic, var(--_ctm-dn-as-cr-as-is-ft-se-ic))
336
+ );
337
+ text-align: var(
338
+ --_ctm-mob-dn-as-cr-as-is-tt-an,
339
+ var(--_ctm-tab-dn-as-cr-as-is-tt-an, var(--_ctm-dn-as-cr-as-is-tt-an))
340
+ );
341
+ }
342
+ }
343
+ .attribute_form_field {
344
+ font-family: var(
345
+ --_ctm-mob-dn-as-cr-as-is-ft-fy,
346
+ var(--_ctm-tab-dn-as-cr-as-is-ft-fy, var(--_ctm-dn-as-cr-as-is-ft-fy))
347
+ );
348
+ color: var(
349
+ --_ctm-mob-dn-as-cr-as-is-cr,
350
+ var(--_ctm-tab-dn-as-cr-as-is-cr, var(--_ctm-dn-as-cr-as-is-cr))
351
+ );
352
+ font-weight: var(
353
+ --_ctm-mob-dn-as-cr-as-is-ft-wt,
354
+ var(--_ctm-tab-dn-as-cr-as-is-ft-wt, var(--_ctm-dn-as-cr-as-is-ft-wt))
355
+ );
356
+ font-size: var(
357
+ --_ctm-mob-dn-as-cr-as-is-ft-se,
358
+ var(--_ctm-tab-dn-as-cr-as-is-ft-se, var(--_ctm-dn-as-cr-as-is-ft-se))
359
+ );
360
+ text-decoration: var(
361
+ --_ctm-mob-dn-as-cr-as-is-ue,
362
+ var(--_ctm-tab-dn-as-cr-as-is-ue, var(--_ctm-dn-as-cr-as-is-ue))
363
+ );
364
+ letter-spacing: var(
365
+ --_ctm-mob-dn-as-cr-as-is-lr-sg,
366
+ var(--_ctm-tab-dn-as-cr-as-is-lr-sg, var(--_ctm-dn-as-cr-as-is-lr-sg))
367
+ );
368
+ line-height: var(
369
+ --_ctm-mob-dn-as-cr-as-is-le-ht,
370
+ var(--_ctm-tab-dn-as-cr-as-is-le-ht, var(--_ctm-dn-as-cr-as-is-le-ht))
371
+ );
372
+ font-style: var(
373
+ --_ctm-mob-dn-as-cr-as-is-ft-se-ic,
374
+ var(--_ctm-tab-dn-as-cr-as-is-ft-se-ic, var(--_ctm-dn-as-cr-as-is-ft-se-ic))
375
+ );
376
+ text-align: var(
377
+ --_ctm-mob-dn-as-cr-as-is-tt-an,
378
+ var(--_ctm-tab-dn-as-cr-as-is-tt-an, var(--_ctm-dn-as-cr-as-is-tt-an))
379
+ );
380
+ }
381
+ .dropdown-input-section {
382
+ height: auto !important;
383
+ background-color: var(
384
+ --_ctm-mob-dn-as-cr-as-is-bd-cr,
385
+ var(--_ctm-tab-dn-as-cr-as-is-bd-cr, var(--_ctm-dn-as-cr-as-is-bd-cr))
386
+ );
387
+ padding: var(
388
+ --_ctm-mob-dn-as-cr-as-is-pg,
389
+ var(--_ctm-tab-dn-as-cr-as-is-pg, var(--_ctm-dn-as-cr-as-is-pg))
390
+ );
391
+ border-color: var(
392
+ --_ctm-mob-dn-as-cr-as-is-br-cr,
393
+ var(--_ctm-tab-dn-as-cr-as-is-br-cr, var(--_ctm-dn-as-cr-as-is-br-cr))
394
+ );
395
+ border-style: var(
396
+ --_ctm-mob-dn-as-cr-as-is-br-se,
397
+ var(--_ctm-tab-dn-as-cr-as-is-br-se, var(--_ctm-dn-as-cr-as-is-br-se))
398
+ );
399
+ border-width: var(
400
+ --_ctm-mob-dn-as-cr-as-is-br-wh,
401
+ var(--_ctm-tab-dn-as-cr-as-is-br-wh, var(--_ctm-dn-as-cr-as-is-br-wh))
402
+ );
403
+ border-radius: var(
404
+ --_ctm-mob-dn-as-cr-as-is-br-rs,
405
+ var(--_ctm-tab-dn-as-cr-as-is-br-rs, var(--_ctm-dn-as-cr-as-is-br-rs))
406
+ );
407
+ font-family: var(
408
+ --_ctm-mob-dn-as-cr-as-dn-ft-fy,
409
+ var(--_ctm-tab-dn-as-cr-as-dn-ft-fy, var(--_ctm-dn-as-cr-as-dn-ft-fy))
410
+ );
411
+ color: var(
412
+ --_ctm-mob-dn-as-cr-as-dn-cr,
413
+ var(--_ctm-tab-dn-as-cr-as-dn-cr, var(--_ctm-dn-as-cr-as-dn-cr))
414
+ );
415
+ font-weight: var(
416
+ --_ctm-mob-dn-as-cr-as-dn-ft-wt,
417
+ var(--_ctm-tab-dn-as-cr-as-dn-ft-wt, var(--_ctm-dn-as-cr-as-dn-ft-wt))
418
+ );
419
+ font-size: var(
420
+ --_ctm-mob-dn-as-cr-as-dn-ft-se,
421
+ var(--_ctm-tab-dn-as-cr-as-dn-ft-se, var(--_ctm-dn-as-cr-as-dn-ft-se))
422
+ );
423
+ text-decoration: var(
424
+ --_ctm-mob-dn-as-cr-as-dn-ue,
425
+ var(--_ctm-tab-dn-as-cr-as-dn-ue, var(--_ctm-dn-as-cr-as-dn-ue))
426
+ );
427
+ letter-spacing: var(
428
+ --_ctm-mob-dn-as-cr-as-dn-lr-sg,
429
+ var(--_ctm-tab-dn-as-cr-as-dn-lr-sg, var(--_ctm-dn-as-cr-as-dn-lr-sg))
430
+ );
431
+ line-height: var(
432
+ --_ctm-mob-dn-as-cr-as-dn-le-ht,
433
+ var(--_ctm-tab-dn-as-cr-as-dn-le-ht, var(--_ctm-dn-as-cr-as-dn-le-ht))
434
+ );
435
+ font-style: var(
436
+ --_ctm-mob-dn-as-cr-as-dn-ft-se-ic,
437
+ var(--_ctm-tab-dn-as-cr-as-dn-ft-se-ic, var(--_ctm-dn-as-cr-as-dn-ft-se-ic))
438
+ );
439
+ text-align: var(
440
+ --_ctm-mob-dn-as-cr-as-dn-tt-an,
441
+ var(--_ctm-tab-dn-as-cr-as-dn-tt-an, var(--_ctm-dn-as-cr-as-dn-tt-an))
442
+ );
443
+ }
320
444
  &:focus {
321
445
  border-color: var(--_primary-400);
322
446
  outline: 2px solid var(--_primary-200);
@@ -333,12 +457,138 @@
333
457
  color: var(--_gray-500);
334
458
  }
335
459
  }
336
- }
337
- textarea {
338
- min-height: 100px;
339
- resize: vertical;
460
+ .custom-upload {
461
+ display: flex;
462
+ flex-direction: column;
463
+ align-items: center;
464
+ align-self: stretch;
465
+
466
+ background-color: var(
467
+ --_ctm-mob-dn-as-cr-us-bd-cr,
468
+ var(--_ctm-tab-dn-as-cr-us-bd-cr, var(--_ctm-dn-as-cr-us-bd-cr))
469
+ );
470
+ padding: var(
471
+ --_ctm-mob-dn-as-cr-us-pg,
472
+ var(--_ctm-tab-dn-as-cr-us-pg, var(--_ctm-dn-as-cr-us-pg))
473
+ );
474
+ gap: var(
475
+ --_ctm-mob-dn-as-cr-us-im-gp,
476
+ var(--_ctm-tab-dn-as-cr-us-im-gp, var(--_ctm-dn-as-cr-us-im-gp))
477
+ );
478
+ border-color: var(
479
+ --_ctm-mob-dn-as-cr-us-br-cr,
480
+ var(--_ctm-tab-dn-as-cr-us-br-cr, var(--_ctm-dn-as-cr-us-br-cr))
481
+ );
482
+ border-style: var(
483
+ --_ctm-mob-dn-as-cr-us-br-se,
484
+ var(--_ctm-tab-dn-as-cr-us-br-se, var(--_ctm-dn-as-cr-us-br-se))
485
+ );
486
+ border-width: var(
487
+ --_ctm-mob-dn-as-cr-us-br-wh,
488
+ var(--_ctm-tab-dn-as-cr-us-br-wh, var(--_ctm-dn-as-cr-us-br-wh))
489
+ );
490
+ border-radius: var(
491
+ --_ctm-mob-dn-as-cr-us-br-rs,
492
+ var(--_ctm-tab-dn-as-cr-us-br-rs, var(--_ctm-dn-as-cr-us-br-rs))
493
+ );
494
+ .file_upload_text {
495
+ text-align: center;
496
+ display: flex;
497
+ flex-direction: column;
498
+ gap: 6px;
499
+ p {
500
+ strong {
501
+ font-family: var(
502
+ --_ctm-mob-dn-as-cr-us-ft-fy,
503
+ var(--_ctm-tab-dn-as-cr-us-ft-fy, var(--_ctm-dn-as-cr-us-ft-fy))
504
+ );
505
+ color: var(
506
+ --_ctm-mob-dn-as-cr-us-cr,
507
+ var(--_ctm-tab-dn-as-cr-us-cr, var(--_ctm-dn-as-cr-us-cr))
508
+ );
509
+ font-weight: var(
510
+ --_ctm-mob-dn-as-cr-us-ft-wt,
511
+ var(--_ctm-tab-dn-as-cr-us-ft-wt, var(--_ctm-dn-as-cr-us-ft-wt))
512
+ );
513
+ font-size: var(
514
+ --_ctm-mob-dn-as-cr-us-ft-se,
515
+ var(--_ctm-tab-dn-as-cr-us-ft-se, var(--_ctm-dn-as-cr-us-ft-se))
516
+ );
517
+ text-decoration: var(
518
+ --_ctm-mob-dn-as-cr-us-ue,
519
+ var(--_ctm-tab-dn-as-cr-us-ue, var(--_ctm-dn-as-cr-us-ue))
520
+ );
521
+ letter-spacing: var(
522
+ --_ctm-mob-dn-as-cr-us-lr-sg,
523
+ var(--_ctm-tab-dn-as-cr-us-lr-sg, var(--_ctm-dn-as-cr-us-lr-sg))
524
+ );
525
+ line-height: var(
526
+ --_ctm-mob-dn-as-cr-us-le-ht,
527
+ var(--_ctm-tab-dn-as-cr-us-le-ht, var(--_ctm-dn-as-cr-us-le-ht))
528
+ );
529
+ font-style: var(
530
+ --_ctm-mob-dn-as-cr-us-ft-se-ic,
531
+ var(--_ctm-tab-dn-as-cr-us-ft-se-ic, var(--_ctm-dn-as-cr-us-ft-se-ic))
532
+ );
533
+ text-align: var(
534
+ --_ctm-mob-dn-as-cr-us-tt-an,
535
+ var(--_ctm-tab-dn-as-cr-us-tt-an, var(--_ctm-dn-as-cr-us-tt-an))
536
+ );
537
+ }
538
+ }
539
+ span {
540
+ font-family: var(
541
+ --_ctm-mob-dn-as-cr-us-ft-fy-dc,
542
+ var(--_ctm-tab-dn-as-cr-us-ft-fy-dc, var(--_ctm-dn-as-cr-us-ft-fy-dc))
543
+ );
544
+ color: var(
545
+ --_ctm-mob-dn-as-cr-us-cr-dc,
546
+ var(--_ctm-tab-dn-as-cr-us-cr-dc, var(--_ctm-dn-as-cr-us-cr-dc))
547
+ );
548
+ font-weight: var(
549
+ --_ctm-mob-dn-as-cr-us-ft-wt-dc,
550
+ var(--_ctm-tab-dn-as-cr-us-ft-wt-dc, var(--_ctm-dn-as-cr-us-ft-wt-dc))
551
+ );
552
+ font-size: var(
553
+ --_ctm-mob-dn-as-cr-us-ft-se-dc,
554
+ var(--_ctm-tab-dn-as-cr-us-ft-se-dc, var(--_ctm-dn-as-cr-us-ft-se-dc))
555
+ );
556
+ text-decoration: var(
557
+ --_ctm-mob-dn-as-cr-us-ue-dc,
558
+ var(--_ctm-tab-dn-as-cr-us-ue-dc, var(--_ctm-dn-as-cr-us-ue-dc))
559
+ );
560
+ letter-spacing: var(
561
+ --_ctm-mob-dn-as-cr-us-lr-sg-dc,
562
+ var(--_ctm-tab-dn-as-cr-us-lr-sg-dc, var(--_ctm-dn-as-cr-us-lr-sg-dc))
563
+ );
564
+ line-height: var(
565
+ --_ctm-mob-dn-as-cr-us-le-ht-dc,
566
+ var(--_ctm-tab-dn-as-cr-us-le-ht-dc, var(--_ctm-dn-as-cr-us-le-ht-dc))
567
+ );
568
+ font-style: var(
569
+ --_ctm-mob-dn-as-cr-us-ft-se-ic-dc,
570
+ var(--_ctm-tab-dn-as-cr-us-ft-se-ic-dc, var(--_ctm-dn-as-cr-us-ft-se-ic-dc))
571
+ );
572
+ text-align: var(
573
+ --_ctm-mob-dn-as-cr-us-tt-an-dc,
574
+ var(--_ctm-tab-dn-as-cr-us-tt-an-dc, var(--_ctm-dn-as-cr-us-tt-an-dc))
575
+ );
576
+ }
577
+ }
578
+ .uploadicon {
579
+ // padding: 10px;
580
+ // background: #f2f4f7;
581
+ display: inline-block;
582
+ // border-radius: 50%;
583
+ // color: var(--_gray-600);
584
+ }
585
+ }
340
586
  }
341
587
  }
588
+ .error-text {
589
+ font-size: 12px;
590
+ color: var(--_error-500);
591
+ }
342
592
  .text_area_attribute {
343
593
  width: 100%;
344
594
  .input_textarea_a {
@@ -347,6 +597,7 @@
347
597
  }
348
598
  .cart_item_attr_disabled {
349
599
  pointer-events: none;
600
+
350
601
  opacity: 0.5;
351
602
  cursor: auto;
352
603
  }
@@ -355,47 +606,157 @@
355
606
  }
356
607
 
357
608
  // toggle styles
358
- .input_toggle_switch {
359
- position: relative;
360
- display: inline-block;
361
- width: 50px;
362
- height: 28px;
609
+ .input_toggle_switch_container {
610
+ display: flex;
611
+ background-color: var(
612
+ --_ctm-mob-dn-as-cr-as-bs-bd-cr,
613
+ var(--_ctm-tab-dn-as-cr-as-bs-bd-cr, var(--_ctm-dn-as-cr-as-bs-bd-cr))
614
+ );
615
+ border-color: var(
616
+ --_ctm-mob-dn-as-cr-as-bs-br-cr,
617
+ var(--_ctm-tab-dn-as-cr-as-bs-br-cr, var(--_ctm-dn-as-cr-as-bs-br-cr))
618
+ );
619
+ border-style: var(
620
+ --_ctm-mob-dn-as-cr-as-bs-br-se,
621
+ var(--_ctm-tab-dn-as-cr-as-bs-br-se, var(--_ctm-dn-as-cr-as-bs-br-se))
622
+ );
623
+ border-width: var(
624
+ --_ctm-mob-dn-as-cr-as-bs-br-wh,
625
+ var(--_ctm-tab-dn-as-cr-as-bs-br-wh, var(--_ctm-dn-as-cr-as-bs-br-wh))
626
+ );
627
+ border-radius: var(
628
+ --_ctm-mob-dn-as-cr-as-bs-br-rs,
629
+ var(--_ctm-tab-dn-as-cr-as-bs-br-rs, var(--_ctm-dn-as-cr-as-bs-br-rs))
630
+ );
631
+ padding: var(
632
+ --_ctm-mob-dn-as-cr-as-bs-pg,
633
+ var(--_ctm-tab-dn-as-cr-as-bs-pg, var(--_ctm-dn-as-cr-as-bs-pg))
634
+ );
635
+ gap: var(
636
+ --_ctm-mob-dn-as-cr-as-bs-im-gp,
637
+ var(--_ctm-tab-dn-as-cr-as-bs-im-gp, var(--_ctm-dn-as-cr-as-bs-im-gp))
638
+ );
639
+ .input_toggle_switch {
640
+ position: relative;
641
+ display: inline-block;
642
+ width: 50px;
643
+ height: 28px;
363
644
 
364
- input[type="checkbox"] {
365
- opacity: 0;
366
- width: 0;
367
- height: 0;
645
+ input[type="checkbox"] {
646
+ opacity: 0;
647
+ width: 0;
648
+ height: 0;
368
649
 
369
- &:checked + .slider {
370
- background-color: #4caf50;
650
+ &:checked + .slider {
651
+ background-color: #4caf50;
371
652
 
372
- &::before {
373
- transform: translateX(22px);
653
+ &::before {
654
+ transform: translateX(22px);
655
+ }
374
656
  }
375
657
  }
376
- }
377
658
 
378
- .slider {
379
- position: absolute;
380
- cursor: pointer;
381
- top: 0;
382
- left: 0;
383
- right: 0;
384
- bottom: 0;
385
- background-color: #ccc;
386
- transition: 0.4s;
387
- border-radius: 28px;
388
-
389
- &::before {
659
+ .slider {
390
660
  position: absolute;
391
- content: "";
392
- height: 22px;
393
- width: 22px;
394
- left: 3px;
395
- bottom: 3px;
396
- background-color: white;
397
- border-radius: 50%;
661
+ cursor: pointer;
662
+ top: 0;
663
+ left: 0;
664
+ right: 0;
665
+ bottom: 0;
666
+ background-color: #ccc;
398
667
  transition: 0.4s;
668
+ border-radius: 28px;
669
+
670
+ &::before {
671
+ position: absolute;
672
+ content: "";
673
+ height: 22px;
674
+ width: 22px;
675
+ left: 3px;
676
+ bottom: 3px;
677
+ background-color: white;
678
+ border-radius: 50%;
679
+ transition: 0.4s;
680
+ }
681
+ }
682
+ }
683
+ .input_toggle_switch_text {
684
+ gap: 2px;
685
+ .checkbox_title {
686
+ font-family: var(
687
+ --_ctm-mob-dn-as-cr-as-bs-ft-fy,
688
+ var(--_ctm-tab-dn-as-cr-as-bs-ft-fy, var(--_ctm-dn-as-cr-as-bs-ft-fy))
689
+ );
690
+ color: var(
691
+ --_ctm-mob-dn-as-cr-as-bs-cr,
692
+ var(--_ctm-tab-dn-as-cr-as-bs-cr, var(--_ctm-dn-as-cr-as-bs-cr))
693
+ );
694
+ font-weight: var(
695
+ --_ctm-mob-dn-as-cr-as-bs-ft-wt,
696
+ var(--_ctm-tab-dn-as-cr-as-bs-ft-wt, var(--_ctm-dn-as-cr-as-bs-ft-wt))
697
+ );
698
+ font-size: var(
699
+ --_ctm-mob-dn-as-cr-as-bs-ft-se,
700
+ var(--_ctm-tab-dn-as-cr-as-bs-ft-se, var(--_ctm-dn-as-cr-as-bs-ft-se))
701
+ );
702
+ text-decoration: var(
703
+ --_ctm-mob-dn-as-cr-as-bs-ue,
704
+ var(--_ctm-tab-dn-as-cr-as-bs-ue, var(--_ctm-dn-as-cr-as-bs-ue))
705
+ );
706
+ letter-spacing: var(
707
+ --_ctm-mob-dn-as-cr-as-bs-lr-sg,
708
+ var(--_ctm-tab-dn-as-cr-as-bs-lr-sg, var(--_ctm-dn-as-cr-as-bs-lr-sg))
709
+ );
710
+ line-height: var(
711
+ --_ctm-mob-dn-as-cr-as-bs-le-ht,
712
+ var(--_ctm-tab-dn-as-cr-as-bs-le-ht, var(--_ctm-dn-as-cr-as-bs-le-ht))
713
+ );
714
+ font-style: var(
715
+ --_ctm-mob-dn-as-cr-as-bs-ft-se-ic,
716
+ var(--_ctm-tab-dn-as-cr-as-bs-ft-se-ic, var(--_ctm-dn-as-cr-as-bs-ft-se-ic))
717
+ );
718
+ text-align: var(
719
+ --_ctm-mob-dn-as-cr-as-bs-tt-an,
720
+ var(--_ctm-tab-dn-as-cr-as-bs-tt-an, var(--_ctm-dn-as-cr-as-bs-tt-an))
721
+ );
722
+ }
723
+ .checkbox_des {
724
+ font-family: var(
725
+ --_ctm-mob-dn-as-cr-as-bs-ft-fy-dc,
726
+ var(--_ctm-tab-dn-as-cr-as-bs-ft-fy-dc, var(--_ctm-dn-as-cr-as-bs-ft-fy-dc))
727
+ );
728
+ color: var(
729
+ --_ctm-mob-dn-as-cr-as-bs-cr-dc,
730
+ var(--_ctm-tab-dn-as-cr-as-bs-cr-dc, var(--_ctm-dn-as-cr-as-bs-cr-dc))
731
+ );
732
+ font-weight: var(
733
+ --_ctm-mob-dn-as-cr-as-bs-ft-wt-dc,
734
+ var(--_ctm-tab-dn-as-cr-as-bs-ft-wt-dc, var(--_ctm-dn-as-cr-as-bs-ft-wt-dc))
735
+ );
736
+ font-size: var(
737
+ --_ctm-mob-dn-as-cr-as-bs-ft-se-dc,
738
+ var(--_ctm-tab-dn-as-cr-as-bs-ft-se-dc, var(--_ctm-dn-as-cr-as-bs-ft-se-dc))
739
+ );
740
+ text-decoration: var(
741
+ --_ctm-mob-dn-as-cr-as-bs-ue-dc,
742
+ var(--_ctm-tab-dn-as-cr-as-bs-ue-dc, var(--_ctm-dn-as-cr-as-bs-ue-dc))
743
+ );
744
+ letter-spacing: var(
745
+ --_ctm-mob-dn-as-cr-as-bs-lr-sg-dc,
746
+ var(--_ctm-tab-dn-as-cr-as-bs-lr-sg-dc, var(--_ctm-dn-as-cr-as-bs-lr-sg-dc))
747
+ );
748
+ line-height: var(
749
+ --_ctm-mob-dn-as-cr-as-bs-le-ht-dc,
750
+ var(--_ctm-tab-dn-as-cr-as-bs-le-ht-dc, var(--_ctm-dn-as-cr-as-bs-le-ht-dc))
751
+ );
752
+ font-style: var(
753
+ --_ctm-mob-dn-as-cr-as-bs-ft-se-ic-dc,
754
+ var(--_ctm-tab-dn-as-cr-as-bs-ft-se-ic-dc, var(--_ctm-dn-as-cr-as-bs-ft-se-ic-dc))
755
+ );
756
+ text-align: var(
757
+ --_ctm-mob-dn-as-cr-as-bs-tt-an-dc,
758
+ var(--_ctm-tab-dn-as-cr-as-bs-tt-an-dc, var(--_ctm-dn-as-cr-as-bs-tt-an-dc))
759
+ );
399
760
  }
400
761
  }
401
762
  }
@@ -451,53 +812,53 @@
451
812
  }
452
813
  }
453
814
 
454
- .custom-upload {
455
- // text-align: center;
456
- // border: 1px solid var(--_gray-200);
457
- // border-radius: 6px;
458
- // padding: 16px;
459
- border-radius: 6px;
460
- border: 1px solid var(--Gray-200, #eaecf0);
461
- background: var(--Base-White, #fff);
462
- display: flex;
463
- padding: 16px 24px;
464
- flex-direction: column;
465
- align-items: center;
466
- gap: 4px;
467
- align-self: stretch;
468
- &:hover {
469
- cursor: pointer;
470
- border: 1px solid var(--_primary-200);
471
- background: var(--_primary-25);
472
- }
473
- .uploadicon {
474
- padding: 10px;
475
- background: #f2f4f7;
476
- display: inline-block;
477
- border-radius: 50%;
478
- margin-bottom: 12px;
479
- color: var(--_gray-600);
480
- }
481
- p {
482
- padding-bottom: 4px;
483
- color: var(--_gray-600);
484
- font-size: 14px;
485
- strong {
486
- // color: var(--_primary-400);
487
- // font-weight: 600;
488
- color: var(--Primary-400, #243dc6);
489
- font-size: 14px;
490
- font-weight: 600;
491
- // line-height: 20px;
492
- }
493
- }
494
- span {
495
- color: var(--Gray-600, #475467);
496
- font-size: 14px;
497
- font-weight: 400;
498
- // line-height: 20px;
499
- }
500
- }
815
+ // .custom-upload {
816
+ // // text-align: center;
817
+ // // border: 1px solid var(--_gray-200);
818
+ // // border-radius: 6px;
819
+ // // padding: 16px;
820
+ // border-radius: 6px;
821
+ // border: 1px solid var(--Gray-200, #eaecf0);
822
+ // background: var(--Base-White, #fff);
823
+ // display: flex;
824
+ // padding: 16px 24px;
825
+ // flex-direction: column;
826
+ // align-items: center;
827
+ // gap: 4px;
828
+ // align-self: stretch;
829
+ // &:hover {
830
+ // cursor: pointer;
831
+ // border: 1px solid var(--_primary-200);
832
+ // background: var(--_primary-25);
833
+ // }
834
+ // .uploadicon {
835
+ // padding: 10px;
836
+ // background: #f2f4f7;
837
+ // display: inline-block;
838
+ // border-radius: 50%;
839
+ // margin-bottom: 12px;
840
+ // color: var(--_gray-600);
841
+ // }
842
+ // p {
843
+ // padding-bottom: 4px;
844
+ // color: var(--_gray-600);
845
+ // font-size: 14px;
846
+ // strong {
847
+ // // color: var(--_primary-400);
848
+ // // font-weight: 600;
849
+ // color: var(--Primary-400, #243dc6);
850
+ // font-size: 14px;
851
+ // font-weight: 600;
852
+ // // line-height: 20px;
853
+ // }
854
+ // }
855
+ // span {
856
+ // color: var(--Gray-600, #475467);
857
+ // font-size: 14px;
858
+ // font-weight: 400;
859
+ // // line-height: 20px;
860
+ // }
861
+ // }
501
862
 
502
863
  .input_color_picker_a {
503
864
  width: 100% !important;