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

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.
@@ -27,7 +27,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
27
27
 
28
28
  .cart_details_wrapper {
29
29
  display: flex;
30
- padding: 16px 0px;
30
+ // padding: 16px 0px;
31
31
  align-items: flex-start;
32
32
  align-self: stretch;
33
33
 
@@ -146,6 +146,9 @@ $resizeActive: '[data-cms-element-resizer="true"]';
146
146
  --_ctm-mob-dn-ct-an-ss-pg,
147
147
  var(--_ctm-tab-dn-ct-an-ss-pg, var(--_ctm-dn-ct-an-ss-pg))
148
148
  );
149
+ &[data-has-link="true"] {
150
+ cursor: pointer;
151
+ }
149
152
  // color: var(--_ctm-dn-ct-an-ss-cr);
150
153
  // font-size: var(--_ctm-dn-ct-an-ss-ft-se);
151
154
  // font-weight: var(--_ctm-dn-ct-an-ss-ft-wt);
@@ -1260,6 +1260,167 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1260
1260
  );
1261
1261
  }
1262
1262
  }
1263
+ .cart_summary_placeOrder_btn_wrapper {
1264
+ // padding: var(--_ctm-lt-bn-pg) calc(var(--_ctm-lt-bn-pg) * 2);
1265
+ width: 100%;
1266
+ height: auto;
1267
+ // min-height: 48px;
1268
+ background-color: var(
1269
+ --_ctm-mob-dn-pe-or-bn-dt-se-bd-cr,
1270
+ var(--_ctm-tab-dn-pe-or-bn-dt-se-bd-cr, var(--_ctm-dn-pe-or-bn-dt-se-bd-cr))
1271
+ );
1272
+ border-color: var(
1273
+ --_ctm-mob-dn-pe-or-bn-dt-se-br-cr,
1274
+ var(--_ctm-tab-dn-pe-or-bn-dt-se-br-cr, var(--_ctm-dn-pe-or-bn-dt-se-br-cr))
1275
+ );
1276
+ border-radius: var(
1277
+ --_ctm-mob-dn-pe-or-bn-dt-se-br-rs,
1278
+ var(--_ctm-tab-dn-pe-or-bn-dt-se-br-rs, var(--_ctm-dn-pe-or-bn-dt-se-br-rs))
1279
+ );
1280
+ border-style: var(
1281
+ --_ctm-mob-dn-pe-or-bn-dt-se-br-se,
1282
+ var(--_ctm-tab-dn-pe-or-bn-dt-se-br-se, var(--_ctm-dn-pe-or-bn-dt-se-br-se))
1283
+ );
1284
+ border-width: var(
1285
+ --_ctm-mob-dn-pe-or-bn-dt-se-br-wh,
1286
+ var(--_ctm-tab-dn-pe-or-bn-dt-se-br-wh, var(--_ctm-dn-pe-or-bn-dt-se-br-wh))
1287
+ );
1288
+ color: var(
1289
+ --_ctm-mob-dn-pe-or-bn-dt-se-cr,
1290
+ var(--_ctm-tab-dn-pe-or-bn-dt-se-cr, var(--_ctm-dn-pe-or-bn-dt-se-cr))
1291
+ );
1292
+ font-family: var(
1293
+ --_ctm-mob-dn-pe-or-bn-dt-se-ft-fy,
1294
+ var(--_ctm-tab-dn-pe-or-bn-dt-se-ft-fy, var(--_ctm-dn-pe-or-bn-dt-se-ft-fy))
1295
+ );
1296
+ font-size: var(
1297
+ --_ctm-mob-dn-pe-or-bn-dt-se-ft-se,
1298
+ var(--_ctm-tab-dn-pe-or-bn-dt-se-ft-se, var(--_ctm-dn-pe-or-bn-dt-se-ft-se))
1299
+ );
1300
+ font-style: var(
1301
+ --_ctm-mob-dn-pe-or-bn-dt-se-ft-se-ic,
1302
+ var(--_ctm-tab-dn-pe-or-bn-dt-se-ft-se-ic, var(--_ctm-dn-pe-or-bn-dt-se-ft-se-ic))
1303
+ );
1304
+ font-weight: var(
1305
+ --_ctm-mob-dn-pe-or-bn-dt-se-ft-wt,
1306
+ var(--_ctm-tab-dn-pe-or-bn-dt-se-ft-wt, var(--_ctm-dn-pe-or-bn-dt-se-ft-wt))
1307
+ );
1308
+ line-height: var(
1309
+ --_ctm-mob-dn-pe-or-bn-dt-se-le-ht,
1310
+ var(--_ctm-tab-dn-pe-or-bn-dt-se-le-ht, var(--_ctm-dn-pe-or-bn-dt-se-le-ht))
1311
+ );
1312
+ letter-spacing: var(
1313
+ --_ctm-mob-dn-pe-or-bn-dt-se-lr-sg,
1314
+ var(--_ctm-tab-dn-pe-or-bn-dt-se-lr-sg, var(--_ctm-dn-pe-or-bn-dt-se-lr-sg))
1315
+ );
1316
+ box-shadow: var(
1317
+ --_ctm-mob-dn-pe-or-bn-dt-se-sw-ae,
1318
+ var(--_ctm-tab-dn-pe-or-bn-dt-se-sw-ae, var(--_ctm-dn-pe-or-bn-dt-se-sw-ae))
1319
+ )
1320
+ var(
1321
+ --_ctm-mob-dn-pe-or-bn-dt-se-sw-br,
1322
+ var(--_ctm-tab-dn-pe-or-bn-dt-se-sw-br, var(--_ctm-dn-pe-or-bn-dt-se-sw-br))
1323
+ )
1324
+ var(
1325
+ --_ctm-mob-dn-pe-or-bn-dt-se-sw-sd,
1326
+ var(--_ctm-tab-dn-pe-or-bn-dt-se-sw-sd, var(--_ctm-dn-pe-or-bn-dt-se-sw-sd))
1327
+ )
1328
+ var(
1329
+ --_ctm-mob-dn-pe-or-bn-dt-se-sw-cr,
1330
+ var(--_ctm-tab-dn-pe-or-bn-dt-se-sw-cr, var(--_ctm-dn-pe-or-bn-dt-se-sw-cr))
1331
+ );
1332
+ text-decoration: var(
1333
+ --_ctm-mob-dn-pe-or-bn-dt-se-ue,
1334
+ var(--_ctm-tab-dn-pe-or-bn-dt-se-ue, var(--_ctm-dn-pe-or-bn-dt-se-ue))
1335
+ );
1336
+ padding: var(
1337
+ --_ctm-mob-dn-pe-or-bn-dt-se-pg,
1338
+ var(--_ctm-tab-dn-pe-or-bn-dt-se-pg, var(--_ctm-dn-pe-or-bn-dt-se-pg))
1339
+ );
1340
+ text-align: var(
1341
+ --_ctm-mob-dn-pe-or-bn-dt-se-tt-an,
1342
+ var(--_ctm-tab-dn-pe-or-bn-dt-se-tt-an, var(--_ctm-dn-pe-or-bn-dt-se-tt-an))
1343
+ );
1344
+
1345
+ &:hover {
1346
+ background-color: var(
1347
+ --_ctm-mob-dn-pe-or-bn-hr-se-bd-cr,
1348
+ var(--_ctm-tab-dn-pe-or-bn-hr-se-bd-cr, var(--_ctm-dn-pe-or-bn-hr-se-bd-cr))
1349
+ );
1350
+ border-color: var(
1351
+ --_ctm-mob-dn-pe-or-bn-hr-se-br-cr,
1352
+ var(--_ctm-tab-dn-pe-or-bn-hr-se-br-cr, var(--_ctm-dn-pe-or-bn-hr-se-br-cr))
1353
+ );
1354
+ border-radius: var(
1355
+ --_ctm-mob-dn-pe-or-bn-hr-se-br-rs,
1356
+ var(--_ctm-tab-dn-pe-or-bn-hr-se-br-rs, var(--_ctm-dn-pe-or-bn-hr-se-br-rs))
1357
+ );
1358
+ border-style: var(
1359
+ --_ctm-mob-dn-pe-or-bn-hr-se-br-se,
1360
+ var(--_ctm-tab-dn-pe-or-bn-hr-se-br-se, var(--_ctm-dn-pe-or-bn-hr-se-br-se))
1361
+ );
1362
+ border-width: var(
1363
+ --_ctm-mob-dn-pe-or-bn-hr-se-br-wh,
1364
+ var(--_ctm-tab-dn-pe-or-bn-hr-se-br-wh, var(--_ctm-dn-pe-or-bn-hr-se-br-wh))
1365
+ );
1366
+ color: var(
1367
+ --_ctm-mob-dn-pe-or-bn-hr-se-cr,
1368
+ var(--_ctm-tab-dn-pe-or-bn-hr-se-cr, var(--_ctm-dn-pe-or-bn-hr-se-cr))
1369
+ );
1370
+ font-family: var(
1371
+ --_ctm-mob-dn-pe-or-bn-hr-se-ft-fy,
1372
+ var(--_ctm-tab-dn-pe-or-bn-hr-se-ft-fy, var(--_ctm-dn-pe-or-bn-hr-se-ft-fy))
1373
+ );
1374
+ font-size: var(
1375
+ --_ctm-mob-dn-pe-or-bn-hr-se-ft-se,
1376
+ var(--_ctm-tab-dn-pe-or-bn-hr-se-ft-se, var(--_ctm-dn-pe-or-bn-hr-se-ft-se))
1377
+ );
1378
+ font-style: var(
1379
+ --_ctm-mob-dn-pe-or-bn-hr-se-ft-se-ic,
1380
+ var(--_ctm-tab-dn-pe-or-bn-hr-se-ft-se-ic, var(--_ctm-dn-pe-or-bn-hr-se-ft-se-ic))
1381
+ );
1382
+ font-weight: var(
1383
+ --_ctm-mob-dn-pe-or-bn-hr-se-ft-wt,
1384
+ var(--_ctm-tab-dn-pe-or-bn-hr-se-ft-wt, var(--_ctm-dn-pe-or-bn-hr-se-ft-wt))
1385
+ );
1386
+ line-height: var(
1387
+ --_ctm-mob-dn-pe-or-bn-hr-se-le-ht,
1388
+ var(--_ctm-tab-dn-pe-or-bn-hr-se-le-ht, var(--_ctm-dn-pe-or-bn-hr-se-le-ht))
1389
+ );
1390
+ letter-spacing: var(
1391
+ --_ctm-mob-dn-pe-or-bn-hr-se-lr-sg,
1392
+ var(--_ctm-tab-dn-pe-or-bn-hr-se-lr-sg, var(--_ctm-dn-pe-or-bn-hr-se-lr-sg))
1393
+ );
1394
+ box-shadow: var(
1395
+ --_ctm-mob-dn-pe-or-bn-hr-se-sw-ae,
1396
+ var(--_ctm-tab-dn-pe-or-bn-hr-se-sw-ae, var(--_ctm-dn-pe-or-bn-hr-se-sw-ae))
1397
+ )
1398
+ var(
1399
+ --_ctm-mob-dn-pe-or-bn-hr-se-sw-br,
1400
+ var(--_ctm-tab-dn-pe-or-bn-hr-se-sw-br, var(--_ctm-dn-pe-or-bn-hr-se-sw-br))
1401
+ )
1402
+ var(
1403
+ --_ctm-mob-dn-pe-or-bn-hr-se-sw-sd,
1404
+ var(--_ctm-tab-dn-pe-or-bn-hr-se-sw-sd, var(--_ctm-dn-pe-or-bn-hr-se-sw-sd))
1405
+ )
1406
+ var(
1407
+ --_ctm-mob-dn-pe-or-bn-hr-se-sw-cr,
1408
+ var(--_ctm-tab-dn-pe-or-bn-hr-se-sw-cr, var(--_ctm-dn-pe-or-bn-hr-se-sw-cr))
1409
+ );
1410
+ text-decoration: var(
1411
+ --_ctm-mob-dn-pe-or-bn-hr-se-ue,
1412
+ var(--_ctm-tab-dn-pe-or-bn-hr-se-ue, var(--_ctm-dn-pe-or-bn-hr-se-ue))
1413
+ );
1414
+ padding: var(
1415
+ --_ctm-mob-dn-pe-or-bn-hr-se-pg,
1416
+ var(--_ctm-tab-dn-pe-or-bn-hr-se-pg, var(--_ctm-dn-pe-or-bn-hr-se-pg))
1417
+ );
1418
+ text-align: var(
1419
+ --_ctm-mob-dn-pe-or-bn-hr-se-tt-an,
1420
+ var(--_ctm-tab-dn-pe-or-bn-hr-se-tt-an, var(--_ctm-dn-pe-or-bn-hr-se-tt-an))
1421
+ );
1422
+ }
1423
+ }
1263
1424
 
1264
1425
  .submit_quotes {
1265
1426
  width: 100%;
@@ -208,14 +208,12 @@ $dark-color: #343a40;
208
208
  }
209
209
 
210
210
  .chk_checkout_accordion {
211
- font-family: Arial, sans-serif;
212
- font-size: 0.95rem;
213
- color: $dark-color;
214
211
  display: flex;
215
212
  padding: var(--_ctm-lt-pg);
216
213
  flex-direction: column;
217
214
  gap: var(--_ctm-lt-te-ad-it-gp);
218
215
  word-break: keep-all;
216
+ padding-bottom: 24px;
219
217
 
220
218
  .chk_checkout_title {
221
219
  color: var(--_ctm-dn-ct-hg-dn-cr);
@@ -316,6 +314,7 @@ $dark-color: #343a40;
316
314
  }
317
315
 
318
316
  .accordion-body {
317
+ margin-bottom: 16px;
319
318
  .summary {
320
319
  .chk_shipping_method_label {
321
320
  display: flex;
@@ -1100,6 +1099,129 @@ $dark-color: #343a40;
1100
1099
  text-decoration: var(--_ctm-dn-pt-os-dn-pt-hg-dn-ue);
1101
1100
  }
1102
1101
 
1102
+ // gift card styles
1103
+ .chk_gft_crd_wrapper {
1104
+ display: flex;
1105
+ justify-content: space-between;
1106
+ align-items: center;
1107
+ padding: 16px 16px 0 16px;
1108
+ &_item {
1109
+ display: flex;
1110
+ align-items: center;
1111
+ gap: 16px;
1112
+ &_icon {
1113
+ width: 40px;
1114
+ height: 40px;
1115
+ border: 1px solid var(--_gray-200);
1116
+ border-radius: 6px;
1117
+ display: flex;
1118
+ justify-content: center;
1119
+ align-items: center;
1120
+ }
1121
+ &_info {
1122
+ display: flex;
1123
+ flex-direction: column;
1124
+ &_title {
1125
+ font-size: 14px;
1126
+ margin-bottom: 4px;
1127
+ font-weight: 600;
1128
+ }
1129
+ &_desc {
1130
+ display: flex;
1131
+ &_value {
1132
+ font-size: 12px;
1133
+ color: var(--_gray-600);
1134
+ }
1135
+ &_label {
1136
+ font-size: 12px;
1137
+ color: var(--_gray-900);
1138
+ }
1139
+ }
1140
+ }
1141
+ &_pin {
1142
+ margin-left: 36px;
1143
+ input[type="number"] {
1144
+ border: 1px solid var(--_gray-300);
1145
+ border-radius: 4px;
1146
+ background-color: var(--_base-white);
1147
+ width: 95px;
1148
+ height: 44px;
1149
+ padding-inline: 10px;
1150
+ &:focus {
1151
+ outline: 2px solid var(--_primary-100);
1152
+ border: 1px solid var(--_primary-300);
1153
+ }
1154
+ }
1155
+ }
1156
+ }
1157
+
1158
+ &_input {
1159
+ border: 1px solid var(--_gray-300);
1160
+ border-radius: 4px;
1161
+ background-color: var(--_base-white);
1162
+ height: 44px;
1163
+ width: 100px;
1164
+ display: flex;
1165
+ align-items: center;
1166
+ gap: 8px;
1167
+ padding-left: 10px;
1168
+ input[type="number"] {
1169
+ background-color: var(--_base-white);
1170
+ padding-right: 10px;
1171
+ }
1172
+ &:focus-within {
1173
+ outline: 2px solid var(--_primary-100);
1174
+ border: 1px solid var(--_primary-300);
1175
+ }
1176
+ }
1177
+ }
1178
+ .chk_gft_crd_wrapper {
1179
+ &_btn {
1180
+ text-align: left;
1181
+ margin-bottom: 16px;
1182
+ color: var(--_primary-400);
1183
+ &:hover {
1184
+ text-decoration: underline;
1185
+ }
1186
+ }
1187
+ }
1188
+
1189
+ // payment other options styles
1190
+ .chk_pmnt_other_options {
1191
+ display: flex;
1192
+ justify-content: space-between;
1193
+ gap: 80px;
1194
+ padding: 16px;
1195
+ .chk_pmnt_other_options_left_container {
1196
+ display: flex;
1197
+ gap: 12px;
1198
+ .chk_pmnt_option_info_wrapper {
1199
+ display: flex;
1200
+ gap: 12px;
1201
+ .cards {
1202
+ display: flex;
1203
+ flex-direction: column;
1204
+ gap: 8px;
1205
+ .chk_payment_options_name {
1206
+ font-weight: 600;
1207
+ }
1208
+ span {
1209
+ font-size: 12px;
1210
+ .chk_payment_options_label {
1211
+ color: var(--_gray-600);
1212
+ }
1213
+ .chk_payment_options_value {
1214
+ color: var(--_gray-900);
1215
+ }
1216
+ }
1217
+ }
1218
+ }
1219
+ }
1220
+ .chk_pmnt_other_options_container {
1221
+ padding: 16px;
1222
+ }
1223
+ }
1224
+
1103
1225
  &__other_option_wrapper {
1104
1226
  display: flex;
1105
1227
  width: 100%;
@@ -1113,8 +1235,12 @@ $dark-color: #343a40;
1113
1235
 
1114
1236
  &_left_container {
1115
1237
  display: flex;
1116
- gap: 12px;
1238
+ gap: 80px;
1117
1239
  align-items: flex-start;
1240
+ & > div {
1241
+ display: flex;
1242
+ gap: 12px;
1243
+ }
1118
1244
 
1119
1245
  @media (max-width: 500px) {
1120
1246
  flex-wrap: wrap;
@@ -1176,7 +1302,6 @@ $dark-color: #343a40;
1176
1302
  &__info_wrapper {
1177
1303
  display: flex;
1178
1304
  flex-direction: column;
1179
- white-space: nowrap;
1180
1305
 
1181
1306
  .chk_payment_options_name {
1182
1307
  color: var(--_ctm-dn-pt-os-dn-pt-ne-dn-cr);
@@ -1224,7 +1349,7 @@ $dark-color: #343a40;
1224
1349
 
1225
1350
  &_input {
1226
1351
  display: flex;
1227
- padding: 10px 12px;
1352
+ padding: 9px 12px;
1228
1353
  align-items: center;
1229
1354
  max-width: 96px;
1230
1355
  background-color: var(--_ctm-dn-pt-os-dn-pt-os-it-dn-dt-se-bd-cr);
@@ -1295,6 +1420,10 @@ $dark-color: #343a40;
1295
1420
  }
1296
1421
  }
1297
1422
  }
1423
+ &_error {
1424
+ font-size: 14px;
1425
+ color: var(--_error-700);
1426
+ }
1298
1427
  }
1299
1428
 
1300
1429
  .chk_billing_address {
@@ -171,44 +171,77 @@
171
171
  }
172
172
  }
173
173
  }
174
-
175
- .user-meta {
176
- font-family: var(
177
- --_ctm-mob-dn-hr-cr-ee-ds-ft-fy,
178
- var(--_ctm-tab-dn-hr-cr-ee-ds-ft-fy, var(--_ctm-dn-hr-cr-ee-ds-ft-fy))
179
- );
180
- font-size: var(
181
- --_ctm-mob-dn-hr-cr-ee-ds-ft-se,
182
- var(--_ctm-tab-dn-hr-cr-ee-ds-ft-se, var(--_ctm-dn-hr-cr-ee-ds-ft-se))
183
- );
184
- color: var(
185
- --_ctm-mob-dn-hr-cr-ee-ds-cr,
186
- var(--_ctm-tab-dn-hr-cr-ee-ds-cr, var(--_ctm-dn-hr-cr-ee-ds-cr))
187
- );
188
- font-weight: var(
189
- --_ctm-mob-dn-hr-cr-ee-ds-ft-wt,
190
- var(--_ctm-tab-dn-hr-cr-ee-ds-ft-wt, var(--_ctm-dn-hr-cr-ee-ds-ft-wt))
191
- );
192
- text-decoration: var(
193
- --_ctm-mob-dn-hr-cr-ee-ds-ue,
194
- var(--_ctm-tab-dn-hr-cr-ee-ds-ue, var(--_ctm-dn-hr-cr-ee-ds-ue))
195
- );
196
- letter-spacing: var(
197
- --_ctm-mob-dn-hr-cr-ee-ds-lr-sg,
198
- var(--_ctm-tab-dn-hr-cr-ee-ds-lr-sg, var(--_ctm-dn-hr-cr-ee-ds-lr-sg))
199
- );
200
- line-height: var(
201
- --_ctm-mob-dn-hr-cr-ee-ds-le-ht,
202
- var(--_ctm-tab-dn-hr-cr-ee-ds-le-ht, var(--_ctm-dn-hr-cr-ee-ds-le-ht))
203
- );
204
- font-style: var(
205
- --_ctm-mob-dn-hr-cr-ee-ds-ft-se-ic,
206
- var(--_ctm-tab-dn-hr-cr-ee-ds-ft-se-ic, var(--_ctm-dn-hr-cr-ee-ds-ft-se-ic))
207
- );
208
- text-align: var(
209
- --_ctm-mob-dn-hr-cr-ee-ds-tt-an,
210
- var(--_ctm-tab-dn-hr-cr-ee-ds-tt-an, var(--_ctm-dn-hr-cr-ee-ds-tt-an))
174
+ .user-meta-list {
175
+ display: flex;
176
+ align-items: center;
177
+ gap: var(
178
+ --_ctm-mob-dn-hr-cr-ee-ds-im-gp,
179
+ var(--_ctm-tab-dn-hr-cr-ee-ds-im-gp, var(--_ctm-dn-hr-cr-ee-ds-im-gp))
211
180
  );
181
+ .meta-item {
182
+ display: flex;
183
+ flex-direction: row;
184
+ align-items: center;
185
+ padding: var(
186
+ --_ctm-mob-dn-hr-cr-ee-ds-pg,
187
+ var(--_ctm-tab-dn-hr-cr-ee-ds-pg, var(--_ctm-dn-hr-cr-ee-ds-pg))
188
+ );
189
+ // gap: 6px;
190
+ .meta-icon {
191
+ svg {
192
+ width: 12px;
193
+ height: 12px;
194
+ }
195
+ padding-right: 6px;
196
+ }
197
+ .meta-text {
198
+ font-family: var(
199
+ --_ctm-mob-dn-hr-cr-ee-ds-ft-fy,
200
+ var(--_ctm-tab-dn-hr-cr-ee-ds-ft-fy, var(--_ctm-dn-hr-cr-ee-ds-ft-fy))
201
+ );
202
+ font-size: var(
203
+ --_ctm-mob-dn-hr-cr-ee-ds-ft-se,
204
+ var(--_ctm-tab-dn-hr-cr-ee-ds-ft-se, var(--_ctm-dn-hr-cr-ee-ds-ft-se))
205
+ );
206
+ color: var(
207
+ --_ctm-mob-dn-hr-cr-ee-ds-cr,
208
+ var(--_ctm-tab-dn-hr-cr-ee-ds-cr, var(--_ctm-dn-hr-cr-ee-ds-cr))
209
+ );
210
+ font-weight: var(
211
+ --_ctm-mob-dn-hr-cr-ee-ds-ft-wt,
212
+ var(--_ctm-tab-dn-hr-cr-ee-ds-ft-wt, var(--_ctm-dn-hr-cr-ee-ds-ft-wt))
213
+ );
214
+ text-decoration: var(
215
+ --_ctm-mob-dn-hr-cr-ee-ds-ue,
216
+ var(--_ctm-tab-dn-hr-cr-ee-ds-ue, var(--_ctm-dn-hr-cr-ee-ds-ue))
217
+ );
218
+ letter-spacing: var(
219
+ --_ctm-mob-dn-hr-cr-ee-ds-lr-sg,
220
+ var(--_ctm-tab-dn-hr-cr-ee-ds-lr-sg, var(--_ctm-dn-hr-cr-ee-ds-lr-sg))
221
+ );
222
+ line-height: var(
223
+ --_ctm-mob-dn-hr-cr-ee-ds-le-ht,
224
+ var(--_ctm-tab-dn-hr-cr-ee-ds-le-ht, var(--_ctm-dn-hr-cr-ee-ds-le-ht))
225
+ );
226
+ font-style: var(
227
+ --_ctm-mob-dn-hr-cr-ee-ds-ft-se-ic,
228
+ var(--_ctm-tab-dn-hr-cr-ee-ds-ft-se-ic, var(--_ctm-dn-hr-cr-ee-ds-ft-se-ic))
229
+ );
230
+ text-align: var(
231
+ --_ctm-mob-dn-hr-cr-ee-ds-tt-an,
232
+ var(--_ctm-tab-dn-hr-cr-ee-ds-tt-an, var(--_ctm-dn-hr-cr-ee-ds-tt-an))
233
+ );
234
+ }
235
+ &:not(:first-child)::before {
236
+ content: "";
237
+ display: inline-block;
238
+ width: 5px;
239
+ height: 5px;
240
+ background: #d0d5dd;
241
+ border-radius: 50%;
242
+ margin-right: 12px;
243
+ }
244
+ }
212
245
  }
213
246
  }
214
247
  }
@@ -714,9 +747,10 @@
714
747
  .status {
715
748
  margin-left: 6px;
716
749
  padding: 2px 8px;
717
- border-radius: 8px;
718
- font-size: 0.7rem;
750
+ border-radius: 4px;
751
+ font-size: 12;
719
752
  font-weight: 500;
753
+ line-height: 18px;
720
754
  }
721
755
 
722
756
  .link-button {
@@ -732,6 +766,8 @@
732
766
  line-height: 18px;
733
767
  background: #eff8ff;
734
768
  color: #0040c1;
769
+ display: inline-block;
770
+ height: 22px;
735
771
  &::before {
736
772
  content: "";
737
773
  display: inline-block;
@@ -1111,8 +1147,8 @@
1111
1147
  align-items: flex-start;
1112
1148
 
1113
1149
  img {
1114
- width: 60px;
1115
- height: 60px;
1150
+ width: 69px;
1151
+ height: 80px;
1116
1152
  object-fit: cover;
1117
1153
  // border-radius: 4px;
1118
1154
  // margin-right: 12px;
@@ -1157,6 +1193,11 @@
1157
1193
  flex: 1;
1158
1194
 
1159
1195
  .item-name {
1196
+ display: -webkit-box;
1197
+ -webkit-line-clamp: 1;
1198
+ -webkit-box-orient: vertical;
1199
+ overflow: hidden;
1200
+ text-overflow: ellipsis;
1160
1201
  margin: 0 0 4px;
1161
1202
  // font-size: 14px;
1162
1203
  // font-weight: 600;
@@ -1375,9 +1416,6 @@
1375
1416
 
1376
1417
  .delivery-date {
1377
1418
  margin: 0;
1378
- // font-size: 0.75rem;
1379
- // color: #1e293b;
1380
- // font-weight: 600;
1381
1419
  padding: var(
1382
1420
  --_ctm-mob-dn-pt-wt-pt-ed-de-pg-dc,
1383
1421
  var(--_ctm-tab-dn-pt-wt-pt-ed-de-pg-dc, var(--_ctm-dn-pt-wt-pt-ed-de-pg-dc))
@@ -1391,8 +1429,8 @@
1391
1429
  var(--_ctm-tab-dn-pt-wt-pt-ed-de-ft-se-dc, var(--_ctm-dn-pt-wt-pt-ed-de-ft-se-dc))
1392
1430
  );
1393
1431
  color: var(
1394
- --_ctm-mob-dn-pt-wt-pt-ed-de-cr,
1395
- var(--_ctm-tab-dn-pt-wt-pt-ed-de-cr, var(--_ctm-dn-pt-wt-pt-ed-de-cr))
1432
+ --_ctm-mob-dn-pt-wt-pt-ed-de-cr-dc,
1433
+ var(--_ctm-tab-dn-pt-wt-pt-ed-de-cr-dc, var(--_ctm-dn-pt-wt-pt-ed-de-cr-dc))
1396
1434
  );
1397
1435
  font-weight: var(
1398
1436
  --_ctm-mob-dn-pt-wt-pt-ed-de-ft-wt-dc,
@@ -1468,12 +1506,17 @@
1468
1506
  }
1469
1507
  }
1470
1508
 
1471
- .more-link {
1472
- color: #243dc6;
1473
- font-size: 14px;
1474
- font-weight: 400;
1475
- line-height: 20px;
1476
- cursor: pointer;
1509
+ .show-more-wrapper {
1510
+ margin: 32px 16px 16px 0px;
1511
+ button {
1512
+ padding: 12px 16px;
1513
+ color: var(--_primary-400);
1514
+ font-weight: 600;
1515
+ border-radius: 6px;
1516
+ &:hover {
1517
+ background-color: var(--_primary-25);
1518
+ }
1519
+ }
1477
1520
  }
1478
1521
  }
1479
1522