@sc-360-v2/storefront-cms-library 0.5.71 → 0.5.73

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 (128) hide show
  1. package/dist/add-existing-form.scss +13 -5
  2. package/dist/add-order.scss +126 -236
  3. package/dist/add-products-tab-details.scss +1048 -2097
  4. package/dist/add-products-tab.scss +666 -1204
  5. package/dist/allocation-header-quota-details.scss +189 -407
  6. package/dist/allocationDetails.scss +1661 -2143
  7. package/dist/allocations-quota-details.scss +159 -323
  8. package/dist/allocations.scss +475 -793
  9. package/dist/amount-estimator.scss +405 -743
  10. package/dist/badge.scss +43 -18
  11. package/dist/brand-basic-elements.scss +76 -124
  12. package/dist/brand.scss +28 -55
  13. package/dist/breadcrumbs.scss +356 -718
  14. package/dist/builder.js +1 -1
  15. package/dist/bulk-variant-picker.scss +1128 -2027
  16. package/dist/bundle.scss +841 -1477
  17. package/dist/bundleCategories.scss +301 -301
  18. package/dist/bundleDetails.scss +3774 -5072
  19. package/dist/button.scss +79 -103
  20. package/dist/buy-for-tab-container.scss +77 -106
  21. package/dist/buyForHeaders.scss +1722 -2976
  22. package/dist/cart-details.scss +481 -1012
  23. package/dist/cart-summary.scss +2234 -2826
  24. package/dist/cart-wrapper.scss +37 -79
  25. package/dist/cart.scss +117 -225
  26. package/dist/cartAttributes.scss +1103 -1422
  27. package/dist/category-groups-element.scss +127 -108
  28. package/dist/category-groups-product-grid.scss +120 -147
  29. package/dist/category-groups-product-image.scss +1162 -1457
  30. package/dist/category-groups-product-options.scss +613 -680
  31. package/dist/category-groups-product-price.scss +1966 -3244
  32. package/dist/category-groups-quota-details.scss +210 -464
  33. package/dist/category.scss +26 -50
  34. package/dist/checkout.scss +24 -16
  35. package/dist/confirm-modal.scss +22 -2
  36. package/dist/container.scss +32 -54
  37. package/dist/countdown.scss +711 -899
  38. package/dist/coupon.scss +1160 -1519
  39. package/dist/default-dropdown.scss +12 -1
  40. package/dist/embroider-template-1-v2.scss +123 -172
  41. package/dist/embroider-template-1.scss +68 -104
  42. package/dist/embroidery.scss +30 -31
  43. package/dist/employee-bulk-order.scss +418 -142
  44. package/dist/faq.scss +228 -408
  45. package/dist/filter-results.scss +125 -265
  46. package/dist/filters.scss +2143 -3040
  47. package/dist/gallery-slider-temp.scss +1458 -1776
  48. package/dist/global-styles.scss +218 -198
  49. package/dist/grid.scss +25 -33
  50. package/dist/hotspot.scss +68 -115
  51. package/dist/image-temp.scss +21 -20
  52. package/dist/item-stock.scss +9 -16
  53. package/dist/kitDetails.scss +2719 -4299
  54. package/dist/kits.scss +24 -19
  55. package/dist/language-selector.scss +211 -361
  56. package/dist/last-x-orders.scss +95 -174
  57. package/dist/layouter-item.scss +75 -103
  58. package/dist/layouter-pro-item.scss +89 -95
  59. package/dist/layouter-pro.scss +87 -92
  60. package/dist/layouter.scss +383 -445
  61. package/dist/light-box-v2.scss +89 -104
  62. package/dist/login.scss +287 -566
  63. package/dist/map.scss +1212 -1359
  64. package/dist/marchandiserSets.scss +95 -104
  65. package/dist/mega-menu-container.scss +96 -109
  66. package/dist/mega-menu.scss +624 -731
  67. package/dist/menu-item.scss +2 -2
  68. package/dist/menu-v2.scss +507 -619
  69. package/dist/multi-select-dropdown.scss +27 -3
  70. package/dist/my-templates.scss +38 -9
  71. package/dist/option-bar.scss +215 -375
  72. package/dist/order-status.scss +1790 -2187
  73. package/dist/overflow-module.scss +6 -7
  74. package/dist/past-orders.scss +118 -149
  75. package/dist/payment-methods.scss +46 -30
  76. package/dist/pickup-locations.scss +558 -1118
  77. package/dist/position-module.scss +20 -17
  78. package/dist/prefix-list.scss +21 -10
  79. package/dist/product-actions.scss +1750 -2055
  80. package/dist/product-basic-elements.scss +108 -169
  81. package/dist/product-highlights.scss +303 -348
  82. package/dist/product-image-allocation.scss +1477 -1477
  83. package/dist/product-image-bundles.scss +337 -642
  84. package/dist/product-inventory.scss +673 -1357
  85. package/dist/product-labels.scss +84 -105
  86. package/dist/product-options.scss +1287 -1444
  87. package/dist/product-price.scss +1283 -2561
  88. package/dist/product-promotions.scss +1388 -2830
  89. package/dist/product-sizechart.scss +516 -905
  90. package/dist/product.scss +28 -61
  91. package/dist/productDetails.scss +19 -39
  92. package/dist/profile.scss +207 -447
  93. package/dist/quantity-selector.scss +837 -1074
  94. package/dist/quick-inventory-check.scss +95 -174
  95. package/dist/quick-links.scss +55 -133
  96. package/dist/quick-order-pad.scss +218 -271
  97. package/dist/quota-details.scss +152 -282
  98. package/dist/quotes.scss +814 -847
  99. package/dist/repeater-embla-controls.scss +35 -15
  100. package/dist/repeater-grid-toggle.scss +156 -166
  101. package/dist/repeater-item.scss +41 -64
  102. package/dist/repeater.scss +671 -814
  103. package/dist/request-for-quotes.scss +66 -16
  104. package/dist/responsive-behaviour.scss +3 -1
  105. package/dist/rfqs.scss +118 -181
  106. package/dist/scroll.scss +93 -172
  107. package/dist/search-results-heading.scss +309 -309
  108. package/dist/search.scss +179 -326
  109. package/dist/section.scss +27 -51
  110. package/dist/shipping-payments.scss +198 -58
  111. package/dist/simple-list.scss +74 -164
  112. package/dist/social.scss +80 -145
  113. package/dist/sort.scss +168 -176
  114. package/dist/stack.scss +23 -34
  115. package/dist/static-global.scss +44 -26
  116. package/dist/stockStatus.scss +11 -19
  117. package/dist/store-locations.scss +577 -1105
  118. package/dist/tab-container.scss +81 -108
  119. package/dist/table-common.scss +217 -408
  120. package/dist/table.scss +271 -502
  121. package/dist/text-temp.scss +8 -7
  122. package/dist/theme-classes.scss +17 -13
  123. package/dist/uom-selector.scss +489 -949
  124. package/dist/user-elements.scss +2588 -2896
  125. package/dist/variant-picker.scss +1281 -2555
  126. package/dist/volume-pricing.scss +541 -1037
  127. package/dist/widget.scss +153 -153
  128. package/package.json +1 -1
@@ -106,6 +106,7 @@ $input-padding: 10px 12px;
106
106
  font-weight: 400;
107
107
  line-height: 20px;
108
108
  }
109
+
109
110
  .msd {
110
111
  width: 100%;
111
112
  }
@@ -115,12 +116,14 @@ $input-padding: 10px 12px;
115
116
  gap: 16px;
116
117
  width: 100%;
117
118
  }
119
+
118
120
  .add-btn {
119
121
  // background-color: $primary;
120
122
  // color: $white;
121
123
  padding: 10px 16px;
122
124
  height: 40px;
123
125
  gap: 6px;
126
+
124
127
  // border-radius: 4px;
125
128
  // font-weight: 600;
126
129
  // font-size: 14px;
@@ -133,10 +136,12 @@ $input-padding: 10px 12px;
133
136
  svg path {
134
137
  stroke: var(--_base-white);
135
138
  }
139
+
136
140
  &.disabled {
137
141
  opacity: 0.4;
138
142
  pointer-events: none;
139
143
  }
144
+
140
145
  .spinner {
141
146
  // margin-top: -3px;
142
147
  display: inline-block;
@@ -162,11 +167,13 @@ $input-padding: 10px 12px;
162
167
  // }
163
168
  }
164
169
  }
170
+
165
171
  .cart_products_wrapper {
166
172
  display: flex;
167
173
  flex-direction: column;
168
174
  gap: 12px;
169
175
  padding-inline: 24px;
176
+
170
177
  .cart_item_wrapper {
171
178
  padding-bottom: 24px;
172
179
 
@@ -178,10 +185,12 @@ $input-padding: 10px 12px;
178
185
  justify-content: space-between;
179
186
  // flex-direction: column;
180
187
  gap: 16px;
188
+
181
189
  .product_details_wrapper {
182
190
  display: flex;
183
191
  gap: 16px;
184
192
  padding-block: 4px;
193
+
185
194
  a {
186
195
  display: flex;
187
196
  align-items: center;
@@ -190,6 +199,7 @@ $input-padding: 10px 12px;
190
199
  overflow: hidden;
191
200
  }
192
201
  }
202
+
193
203
  .product_qty_price_wrapper {
194
204
  display: flex;
195
205
  justify-content: space-between;
@@ -213,6 +223,7 @@ $input-padding: 10px 12px;
213
223
  border: 0.5px solid var(--_thm-cs-be-se-3);
214
224
  background: #fff;
215
225
  box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
226
+
216
227
  &:focus-within {
217
228
  box-shadow: 0 0 0 3px var(--_gray-100);
218
229
  }
@@ -223,6 +234,7 @@ $input-padding: 10px 12px;
223
234
  align-items: center;
224
235
  border-radius: 8px 0px 0px 8px;
225
236
  height: 40px;
237
+
226
238
  p {
227
239
  color: var(--_thm-ty-p1-tt-cr);
228
240
  font-size: var(--_thm-ty-p1-ft-se);
@@ -232,6 +244,7 @@ $input-padding: 10px 12px;
232
244
  white-space: nowrap;
233
245
  }
234
246
  }
247
+
235
248
  .product_qty_input_container {
236
249
  height: 40px;
237
250
  display: flex;
@@ -241,10 +254,12 @@ $input-padding: 10px 12px;
241
254
  background: #fff;
242
255
  border-left: 1px solid var(--_thm-cs-be-se-3);
243
256
  padding: 8px 12px;
257
+
244
258
  .svg_icon {
245
259
  position: absolute;
246
260
  top: 8px;
247
261
  right: 0px;
262
+
248
263
  g {
249
264
  rect {
250
265
  fill: var(--_gray-500);
@@ -254,6 +269,7 @@ $input-padding: 10px 12px;
254
269
  }
255
270
  }
256
271
  }
272
+
257
273
  .product_qty_number {
258
274
  // display: flex;
259
275
  // padding: 8px 12px;
@@ -271,6 +287,7 @@ $input-padding: 10px 12px;
271
287
  // max-width: 80px;
272
288
  text-align: center;
273
289
  width: 75%;
290
+
274
291
  &::-webkit-outer-spin-button,
275
292
  &::-webkit-inner-spin-button {
276
293
  -webkit-appearance: none;
@@ -289,111 +306,80 @@ $input-padding: 10px 12px;
289
306
  // white-space: nowrap;
290
307
  // min-width: 80px;
291
308
  white-space: nowrap;
292
- color: var(
293
- --_ctm-mob-dn-pt-pe-ss-cr,
294
- var(--_ctm-tab-dn-pt-pe-ss-cr, var(--_ctm-dn-pt-pe-ss-cr))
295
- );
296
- font-family: var(
297
- --_sf-hr-ff,
298
- var(
299
- --_ctm-mob-dn-pt-pe-ss-ft-fy,
300
- var(--_ctm-tab-dn-pt-pe-ss-ft-fy, var(--_ctm-dn-pt-pe-ss-ft-fy))
301
- )
302
- );
303
- text-transform: var(
304
- --_sf-hr-tt-tm,
305
- var(
306
- --_ctm-mob-dn-pt-pe-ss-tt-tm,
307
- var(--_ctm-tab-dn-pt-pe-ss-tt-tm, var(--_ctm-dn-pt-pe-ss-tt-tm))
308
- )
309
- );
310
- word-wrap: var(
311
- --_sf-hr-wd-wp,
312
- var(
313
- --_ctm-mob-dn-pt-pe-ss-wd-wp,
314
- var(--_ctm-tab-dn-pt-pe-ss-wd-wp, var(--_ctm-dn-pt-pe-ss-wd-wp))
315
- )
316
- );
317
- word-break: var(
318
- --_sf-hr-wd-bk,
319
- var(
320
- --_ctm-mob-dn-pt-pe-ss-wd-bk,
321
- var(--_ctm-tab-dn-pt-pe-ss-wd-bk, var(--_ctm-dn-pt-pe-ss-wd-bk))
322
- )
323
- );
324
- font-size: var(
325
- --_ctm-mob-dn-pt-pe-ss-ft-se,
326
- var(--_ctm-tab-dn-pt-pe-ss-ft-se, var(--_ctm-dn-pt-pe-ss-ft-se))
327
- );
328
- font-weight: var(
329
- --_ctm-mob-dn-pt-pe-ss-ft-wt,
330
- var(--_ctm-tab-dn-pt-pe-ss-ft-wt, var(--_ctm-dn-pt-pe-ss-ft-wt))
331
- );
332
- font-style: var(
333
- --_ctm-mob-dn-pt-pe-ss-ft-se-ic,
334
- var(--_ctm-tab-dn-pt-pe-ss-ft-se-ic, var(--_ctm-dn-pt-pe-ss-ft-se-ic))
335
- );
309
+ color: var(--_ctm-mob-dn-pt-pe-ss-cr,
310
+ var(--_ctm-tab-dn-pt-pe-ss-cr, var(--_ctm-dn-pt-pe-ss-cr)));
311
+ font-family: var(--_sf-hr-ff,
312
+ var(--_ctm-mob-dn-pt-pe-ss-ft-fy,
313
+ var(--_ctm-tab-dn-pt-pe-ss-ft-fy, var(--_ctm-dn-pt-pe-ss-ft-fy))));
314
+ text-transform: var(--_sf-hr-tt-tm,
315
+ var(--_ctm-mob-dn-pt-pe-ss-tt-tm,
316
+ var(--_ctm-tab-dn-pt-pe-ss-tt-tm, var(--_ctm-dn-pt-pe-ss-tt-tm))));
317
+ word-wrap: var(--_sf-hr-wd-wp,
318
+ var(--_ctm-mob-dn-pt-pe-ss-wd-wp,
319
+ var(--_ctm-tab-dn-pt-pe-ss-wd-wp, var(--_ctm-dn-pt-pe-ss-wd-wp))));
320
+ word-break: var(--_sf-hr-wd-bk,
321
+ var(--_ctm-mob-dn-pt-pe-ss-wd-bk,
322
+ var(--_ctm-tab-dn-pt-pe-ss-wd-bk, var(--_ctm-dn-pt-pe-ss-wd-bk))));
323
+ font-size: var(--_ctm-mob-dn-pt-pe-ss-ft-se,
324
+ var(--_ctm-tab-dn-pt-pe-ss-ft-se, var(--_ctm-dn-pt-pe-ss-ft-se)));
325
+ font-weight: var(--_ctm-mob-dn-pt-pe-ss-ft-wt,
326
+ var(--_ctm-tab-dn-pt-pe-ss-ft-wt, var(--_ctm-dn-pt-pe-ss-ft-wt)));
327
+ font-style: var(--_ctm-mob-dn-pt-pe-ss-ft-se-ic,
328
+ var(--_ctm-tab-dn-pt-pe-ss-ft-se-ic, var(--_ctm-dn-pt-pe-ss-ft-se-ic)));
336
329
  text-align: right;
337
- letter-spacing: var(
338
- --_ctm-mob-dn-pt-pe-ss-lr-sg,
339
- var(--_ctm-tab-dn-pt-pe-ss-lr-sg, var(--_ctm-dn-pt-pe-ss-lr-sg))
340
- );
341
- line-height: var(
342
- --_ctm-mob-dn-pt-pe-ss-le-ht,
343
- var(--_ctm-tab-dn-pt-pe-ss-le-ht, var(--_ctm-dn-pt-pe-ss-le-ht))
344
- );
345
- text-decoration: var(
346
- --_ctm-mob-dn-pt-pe-ss-ue,
347
- var(--_ctm-tab-dn-pt-pe-ss-ue, var(--_ctm-dn-pt-pe-ss-ue))
348
- );
330
+ letter-spacing: var(--_ctm-mob-dn-pt-pe-ss-lr-sg,
331
+ var(--_ctm-tab-dn-pt-pe-ss-lr-sg, var(--_ctm-dn-pt-pe-ss-lr-sg)));
332
+ line-height: var(--_ctm-mob-dn-pt-pe-ss-le-ht,
333
+ var(--_ctm-tab-dn-pt-pe-ss-le-ht, var(--_ctm-dn-pt-pe-ss-le-ht)));
334
+ text-decoration: var(--_ctm-mob-dn-pt-pe-ss-ue,
335
+ var(--_ctm-tab-dn-pt-pe-ss-ue, var(--_ctm-dn-pt-pe-ss-ue)));
349
336
  min-width: 80px;
350
337
  }
351
338
  }
339
+
352
340
  .product_customization_container {
353
341
  display: flex;
354
342
  justify-content: space-between;
355
343
  align-items: center;
356
344
  padding-top: 16px;
357
345
  border-top: 1px solid var(--_thm-cs-be-se-3);
346
+
358
347
  .product_customization_left_container {
359
348
  display: flex;
360
349
  align-items: center;
361
350
  gap: 16px;
362
351
  min-height: 28px;
352
+
363
353
  .wishlist_icon {
364
354
  cursor: pointer;
355
+
365
356
  svg {
366
357
  padding: 4px;
367
358
  border-radius: 4px;
368
- width: var(
369
- --_ctm-mob-dn-pt-an-pt-an-wt-in-se,
370
- var(--_ctm-tab-dn-pt-an-pt-an-wt-in-se, var(--_ctm-dn-pt-an-pt-an-wt-in-se))
371
- );
372
- height: var(
373
- --_ctm-mob-dn-pt-an-pt-an-wt-in-se,
374
- var(--_ctm-tab-dn-pt-an-pt-an-wt-in-se, var(--_ctm-dn-pt-an-pt-an-wt-in-se))
375
- );
359
+ width: var(--_ctm-mob-dn-pt-an-pt-an-wt-in-se,
360
+ var(--_ctm-tab-dn-pt-an-pt-an-wt-in-se, var(--_ctm-dn-pt-an-pt-an-wt-in-se)));
361
+ height: var(--_ctm-mob-dn-pt-an-pt-an-wt-in-se,
362
+ var(--_ctm-tab-dn-pt-an-pt-an-wt-in-se, var(--_ctm-dn-pt-an-pt-an-wt-in-se)));
363
+
376
364
  path {
377
365
  // stroke: var(
378
366
  // --_ctm-mob-dn-pt-an-pt-an-wt-in-c1,
379
367
  // var(--_ctm-tab-dn-pt-an-pt-an-wt-in-c1, var(--_ctm-dn-pt-an-pt-an-wt-in-c1))
380
368
  // );
381
- // Overrides the stroke-width presentation attribute baked into the icon markup.
382
- stroke-width: prepareMediaVariable(--_ctm-dn-pt-an-pt-an-wt-se-wh, 1.25);
369
+ // Overrides the stroke-width presentation attribute baked into the icon markup.
370
+ stroke-width: prepareMediaVariable(--_ctm-dn-pt-an-pt-an-wt-se-wh, 1.25);
383
371
  stroke: var(--_thm-cs-be-se-1);
384
372
  }
385
373
  }
374
+
386
375
  &:hover {
387
376
  svg {
388
377
  background-color: color-mix(in srgb, var(--_thm-cs-at-py) 10%, transparent);
389
- width: var(
390
- --_ctm-mob-dn-pt-an-pt-an-wt-in-se,
391
- var(--_ctm-tab-dn-pt-an-pt-an-wt-in-se, var(--_ctm-dn-pt-an-pt-an-wt-in-se))
392
- );
393
- height: var(
394
- --_ctm-mob-dn-pt-an-pt-an-wt-in-se,
395
- var(--_ctm-tab-dn-pt-an-pt-an-wt-in-se, var(--_ctm-dn-pt-an-pt-an-wt-in-se))
396
- );
378
+ width: var(--_ctm-mob-dn-pt-an-pt-an-wt-in-se,
379
+ var(--_ctm-tab-dn-pt-an-pt-an-wt-in-se, var(--_ctm-dn-pt-an-pt-an-wt-in-se)));
380
+ height: var(--_ctm-mob-dn-pt-an-pt-an-wt-in-se,
381
+ var(--_ctm-tab-dn-pt-an-pt-an-wt-in-se, var(--_ctm-dn-pt-an-pt-an-wt-in-se)));
382
+
397
383
  path {
398
384
  // stroke: var(
399
385
  // --_ctm-mob-dn-pt-an-pt-an-wt-in-c1,
@@ -404,6 +390,7 @@ $input-padding: 10px 12px;
404
390
  }
405
391
  }
406
392
  }
393
+
407
394
  .svg_icon {
408
395
  display: flex;
409
396
  // svg path {
@@ -422,74 +409,49 @@ $input-padding: 10px 12px;
422
409
  // var(--_ctm-tab-dn-pt-as-ss-cr, var(--_ctm-dn-pt-as-ss-cr))
423
410
  // );
424
411
  color: var(--_thm-cs-tt-ls-as);
425
- font-family: var(
426
- --_sf-hr-ff,
427
- var(
428
- --_ctm-mob-dn-pt-as-ss-ft-fy,
429
- var(--_ctm-tab-dn-pt-as-ss-ft-fy, var(--_ctm-dn-pt-as-ss-ft-fy))
430
- )
431
- );
432
- text-transform: var(
433
- --_sf-hr-tt-tm,
434
- var(
435
- --_ctm-mob-dn-pt-as-ss-tt-tm,
436
- var(--_ctm-tab-dn-pt-as-ss-tt-tm, var(--_ctm-dn-pt-as-ss-tt-tm))
437
- )
438
- );
439
- word-wrap: var(
440
- --_sf-hr-wd-wp,
441
- var(
442
- --_ctm-mob-dn-pt-as-ss-wd-wp,
443
- var(--_ctm-tab-dn-pt-as-ss-wd-wp, var(--_ctm-dn-pt-as-ss-wd-wp))
444
- )
445
- );
446
- word-break: var(
447
- --_sf-hr-wd-bk,
448
- var(
449
- --_ctm-mob-dn-pt-as-ss-wd-bk,
450
- var(--_ctm-tab-dn-pt-as-ss-wd-bk, var(--_ctm-dn-pt-as-ss-wd-bk))
451
- )
452
- );
412
+ font-family: var(--_sf-hr-ff,
413
+ var(--_ctm-mob-dn-pt-as-ss-ft-fy,
414
+ var(--_ctm-tab-dn-pt-as-ss-ft-fy, var(--_ctm-dn-pt-as-ss-ft-fy))));
415
+ text-transform: var(--_sf-hr-tt-tm,
416
+ var(--_ctm-mob-dn-pt-as-ss-tt-tm,
417
+ var(--_ctm-tab-dn-pt-as-ss-tt-tm, var(--_ctm-dn-pt-as-ss-tt-tm))));
418
+ word-wrap: var(--_sf-hr-wd-wp,
419
+ var(--_ctm-mob-dn-pt-as-ss-wd-wp,
420
+ var(--_ctm-tab-dn-pt-as-ss-wd-wp, var(--_ctm-dn-pt-as-ss-wd-wp))));
421
+ word-break: var(--_sf-hr-wd-bk,
422
+ var(--_ctm-mob-dn-pt-as-ss-wd-bk,
423
+ var(--_ctm-tab-dn-pt-as-ss-wd-bk, var(--_ctm-dn-pt-as-ss-wd-bk))));
424
+
453
425
  &.flex__overflow {
454
426
  white-space: normal;
455
427
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
456
428
  }
457
- font-size: var(
458
- --_ctm-mob-dn-pt-as-ss-ft-se,
459
- var(--_ctm-tab-dn-pt-as-ss-ft-se, var(--_ctm-dn-pt-as-ss-ft-se))
460
- );
461
- font-weight: var(
462
- --_ctm-mob-dn-pt-as-ss-ft-wt,
463
- var(--_ctm-tab-dn-pt-as-ss-ft-wt, var(--_ctm-dn-pt-as-ss-ft-wt))
464
- );
465
- font-style: var(
466
- --_ctm-mob-dn-pt-as-ss-ft-se-ic,
467
- var(--_ctm-tab-dn-pt-as-ss-ft-se-ic, var(--_ctm-dn-pt-as-ss-ft-se-ic))
468
- );
469
- text-align: var(
470
- --_ctm-mob-dn-pt-as-ss-tt-an,
471
- var(--_ctm-tab-dn-pt-as-ss-tt-an, var(--_ctm-dn-pt-as-ss-tt-an))
472
- );
473
- letter-spacing: var(
474
- --_ctm-mob-dn-pt-as-ss-lr-sg,
475
- var(--_ctm-tab-dn-pt-as-ss-lr-sg, var(--_ctm-dn-pt-as-ss-lr-sg))
476
- );
477
- line-height: var(
478
- --_ctm-mob-dn-pt-as-ss-le-ht,
479
- var(--_ctm-tab-dn-pt-as-ss-le-ht, var(--_ctm-dn-pt-as-ss-le-ht))
480
- );
481
- text-decoration: var(
482
- --_ctm-mob-dn-pt-as-ss-ue,
483
- var(--_ctm-tab-dn-pt-as-ss-ue, var(--_ctm-dn-pt-as-ss-ue))
484
- );
429
+
430
+ font-size: var(--_ctm-mob-dn-pt-as-ss-ft-se,
431
+ var(--_ctm-tab-dn-pt-as-ss-ft-se, var(--_ctm-dn-pt-as-ss-ft-se)));
432
+ font-weight: var(--_ctm-mob-dn-pt-as-ss-ft-wt,
433
+ var(--_ctm-tab-dn-pt-as-ss-ft-wt, var(--_ctm-dn-pt-as-ss-ft-wt)));
434
+ font-style: var(--_ctm-mob-dn-pt-as-ss-ft-se-ic,
435
+ var(--_ctm-tab-dn-pt-as-ss-ft-se-ic, var(--_ctm-dn-pt-as-ss-ft-se-ic)));
436
+ text-align: var(--_ctm-mob-dn-pt-as-ss-tt-an,
437
+ var(--_ctm-tab-dn-pt-as-ss-tt-an, var(--_ctm-dn-pt-as-ss-tt-an)));
438
+ letter-spacing: var(--_ctm-mob-dn-pt-as-ss-lr-sg,
439
+ var(--_ctm-tab-dn-pt-as-ss-lr-sg, var(--_ctm-dn-pt-as-ss-lr-sg)));
440
+ line-height: var(--_ctm-mob-dn-pt-as-ss-le-ht,
441
+ var(--_ctm-tab-dn-pt-as-ss-le-ht, var(--_ctm-dn-pt-as-ss-le-ht)));
442
+ text-decoration: var(--_ctm-mob-dn-pt-as-ss-ue,
443
+ var(--_ctm-tab-dn-pt-as-ss-ue, var(--_ctm-dn-pt-as-ss-ue)));
444
+
485
445
  .attr_val_info_detail {
486
446
  b {
487
447
  margin-right: 4px;
488
448
  }
489
449
  }
450
+
490
451
  .svg_icon {
491
452
  display: flex;
492
453
  transition: all 400ms linear;
454
+
493
455
  svg {
494
456
  path {
495
457
  // stroke: var(
@@ -498,6 +460,7 @@ $input-padding: 10px 12px;
498
460
  // );
499
461
  stroke: var(--_thm-cs-tt-ls-as);
500
462
  }
463
+
501
464
  width: 18px;
502
465
  height: 18px;
503
466
  // margin-top: 2px;
@@ -505,116 +468,96 @@ $input-padding: 10px 12px;
505
468
  }
506
469
  }
507
470
  }
471
+
508
472
  .attributes_validation_info_sec {
509
473
  display: flex;
510
474
  justify-content: center;
511
475
  align-items: center;
512
476
  gap: 4px;
513
477
  white-space: nowrap;
478
+
514
479
  b {
515
480
  margin-right: 4px;
516
481
  }
517
482
  }
483
+
518
484
  .svg_icon svg {
519
485
  vertical-align: middle;
520
486
  }
487
+
521
488
  .svg_icon.down svg {
522
489
  transform: rotate(180deg);
523
490
  transition: transform 400ms linear;
524
491
  // width: 20px;
525
492
  // height: 20px;
526
493
  }
494
+
527
495
  .customizationInfo_button {
528
496
  display: flex;
529
497
  justify-content: center;
530
498
  align-items: center;
531
499
  gap: 8px;
532
500
  white-space: nowrap;
533
- color: var(
534
- --_ctm-mob-dn-pt-rd-io-cr,
535
- var(--_ctm-tab-dn-pt-rd-io-cr, var(--_ctm-dn-pt-rd-io-cr))
536
- );
537
- font-family: var(
538
- --_sf-hr-ff,
539
- var(
540
- --_ctm-mob-dn-pt-rd-io-ft-fy,
541
- var(--_ctm-tab-dn-pt-rd-io-ft-fy, var(--_ctm-dn-pt-rd-io-ft-fy))
542
- )
543
- );
544
- text-transform: var(
545
- --_sf-hr-tt-tm,
546
- var(
547
- --_ctm-mob-dn-pt-rd-io-tt-tm,
548
- var(--_ctm-tab-dn-pt-rd-io-tt-tm, var(--_ctm-dn-pt-rd-io-tt-tm))
549
- )
550
- );
551
- word-wrap: var(
552
- --_sf-hr-wd-wp,
553
- var(
554
- --_ctm-mob-dn-pt-rd-io-wd-wp,
555
- var(--_ctm-tab-dn-pt-rd-io-wd-wp, var(--_ctm-dn-pt-rd-io-wd-wp))
556
- )
557
- );
558
- word-break: var(
559
- --_sf-hr-wd-bk,
560
- var(
561
- --_ctm-mob-dn-pt-rd-io-wd-bk,
562
- var(--_ctm-tab-dn-pt-rd-io-wd-bk, var(--_ctm-dn-pt-rd-io-wd-bk))
563
- )
564
- );
501
+ color: var(--_ctm-mob-dn-pt-rd-io-cr,
502
+ var(--_ctm-tab-dn-pt-rd-io-cr, var(--_ctm-dn-pt-rd-io-cr)));
503
+ font-family: var(--_sf-hr-ff,
504
+ var(--_ctm-mob-dn-pt-rd-io-ft-fy,
505
+ var(--_ctm-tab-dn-pt-rd-io-ft-fy, var(--_ctm-dn-pt-rd-io-ft-fy))));
506
+ text-transform: var(--_sf-hr-tt-tm,
507
+ var(--_ctm-mob-dn-pt-rd-io-tt-tm,
508
+ var(--_ctm-tab-dn-pt-rd-io-tt-tm, var(--_ctm-dn-pt-rd-io-tt-tm))));
509
+ word-wrap: var(--_sf-hr-wd-wp,
510
+ var(--_ctm-mob-dn-pt-rd-io-wd-wp,
511
+ var(--_ctm-tab-dn-pt-rd-io-wd-wp, var(--_ctm-dn-pt-rd-io-wd-wp))));
512
+ word-break: var(--_sf-hr-wd-bk,
513
+ var(--_ctm-mob-dn-pt-rd-io-wd-bk,
514
+ var(--_ctm-tab-dn-pt-rd-io-wd-bk, var(--_ctm-dn-pt-rd-io-wd-bk))));
515
+
565
516
  &.flex__overflow {
566
517
  white-space: normal;
567
518
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
568
519
  }
569
- font-size: var(
570
- --_ctm-mob-dn-pt-rd-io-ft-se,
571
- var(--_ctm-tab-dn-pt-rd-io-ft-se, var(--_ctm-dn-pt-rd-io-ft-se))
572
- );
573
- font-weight: var(
574
- --_ctm-mob-dn-pt-rd-io-ft-wt,
575
- var(--_ctm-tab-dn-pt-rd-io-ft-wt, var(--_ctm-dn-pt-rd-io-ft-wt))
576
- );
577
- font-style: var(
578
- --_ctm-mob-dn-pt-rd-io-ft-se-ic,
579
- var(--_ctm-tab-dn-pt-rd-io-ft-se-ic, var(--_ctm-dn-pt-rd-io-ft-se-ic))
580
- );
581
- text-align: var(
582
- --_ctm-mob-dn-pt-rd-io-tt-an,
583
- var(--_ctm-tab-dn-pt-rd-io-tt-an, var(--_ctm-dn-pt-rd-io-tt-an))
584
- );
585
- letter-spacing: var(
586
- --_ctm-mob-dn-pt-rd-io-lr-sg,
587
- var(--_ctm-tab-dn-pt-rd-io-lr-sg, var(--_ctm-dn-pt-rd-io-lr-sg))
588
- );
589
- line-height: var(
590
- --_ctm-mob-dn-pt-rd-io-le-ht,
591
- var(--_ctm-tab-dn-pt-rd-io-le-ht, var(--_ctm-dn-pt-rd-io-le-ht))
592
- );
593
- text-decoration: var(
594
- --_ctm-mob-dn-pt-qy-ss-ue,
595
- var(--_ctm-tab-dn-pt-qy-ss-ue, var(--_ctm-dn-pt-qy-ss-ue))
596
- );
520
+
521
+ font-size: var(--_ctm-mob-dn-pt-rd-io-ft-se,
522
+ var(--_ctm-tab-dn-pt-rd-io-ft-se, var(--_ctm-dn-pt-rd-io-ft-se)));
523
+ font-weight: var(--_ctm-mob-dn-pt-rd-io-ft-wt,
524
+ var(--_ctm-tab-dn-pt-rd-io-ft-wt, var(--_ctm-dn-pt-rd-io-ft-wt)));
525
+ font-style: var(--_ctm-mob-dn-pt-rd-io-ft-se-ic,
526
+ var(--_ctm-tab-dn-pt-rd-io-ft-se-ic, var(--_ctm-dn-pt-rd-io-ft-se-ic)));
527
+ text-align: var(--_ctm-mob-dn-pt-rd-io-tt-an,
528
+ var(--_ctm-tab-dn-pt-rd-io-tt-an, var(--_ctm-dn-pt-rd-io-tt-an)));
529
+ letter-spacing: var(--_ctm-mob-dn-pt-rd-io-lr-sg,
530
+ var(--_ctm-tab-dn-pt-rd-io-lr-sg, var(--_ctm-dn-pt-rd-io-lr-sg)));
531
+ line-height: var(--_ctm-mob-dn-pt-rd-io-le-ht,
532
+ var(--_ctm-tab-dn-pt-rd-io-le-ht, var(--_ctm-dn-pt-rd-io-le-ht)));
533
+ text-decoration: var(--_ctm-mob-dn-pt-qy-ss-ue,
534
+ var(--_ctm-tab-dn-pt-qy-ss-ue, var(--_ctm-dn-pt-qy-ss-ue)));
597
535
  }
598
536
  }
599
537
  }
600
538
  }
601
539
  }
602
540
  }
541
+
603
542
  &:not(:last-child) {
604
543
  border-bottom: 0.5px solid var(--_gray-300);
605
544
  }
545
+
606
546
  &:not(:first-child) {
607
547
  margin-top: 12px !important;
608
548
  }
549
+
609
550
  .product_price {
610
551
  margin-top: 10px;
611
552
  }
553
+
612
554
  .product_info_container {
613
555
  .product_title {
614
556
  font-weight: 600;
615
557
  text-decoration: none;
616
558
  color: var(--_gray-900);
617
559
  }
560
+
618
561
  .product_code,
619
562
  .product_options {
620
563
  color: var(--_thm-cs-at-sy);
@@ -625,19 +568,24 @@ $input-padding: 10px 12px;
625
568
  font-weight: 600;
626
569
  }
627
570
  }
571
+
628
572
  .product_qty_price_wrapper {
629
573
  // gap: 12px !important;
630
574
  gap: 16px;
631
575
  margin-left: auto;
576
+
632
577
  .product_qty_wrapper {
633
578
  width: 120px;
634
579
  }
580
+
635
581
  .dropdown-input-section {
636
582
  height: 42px;
583
+
637
584
  .product_title {
638
585
  color: var(--_gray-900);
639
586
  font-weight: 600;
640
587
  }
588
+
641
589
  .text_ellipsis {
642
590
  color: var(--_gray-600);
643
591
  }
@@ -652,88 +600,82 @@ $input-padding: 10px 12px;
652
600
  gap: 16px;
653
601
  min-width: 100px;
654
602
  margin-top: 4px;
655
- & > a,
603
+
604
+ &>a,
656
605
  span {
657
606
  cursor: pointer;
658
607
  display: flex;
659
608
  align-items: center;
660
609
  border-radius: 4px;
661
610
  }
662
- & > * {
611
+
612
+ &>* {
663
613
  display: flex;
664
614
  align-items: center;
665
615
  justify-content: center;
666
616
  }
617
+
667
618
  button {
668
619
  display: flex;
669
620
  }
670
- & > a,
671
- & > span {
621
+
622
+ &>a,
623
+ &>span {
672
624
  border-radius: 4px;
673
625
  padding: 4px;
674
626
  }
627
+
675
628
  .edit_icon {
676
629
  cursor: pointer;
630
+
677
631
  svg {
678
- width: var(
679
- --_ctm-mob-dn-pt-an-pt-an-et-dt-se-in-se,
680
- var(--_ctm-tab-dn-pt-an-pt-an-et-dt-se-in-se, var(--_ctm-dn-pt-an-pt-an-et-dt-se-in-se))
681
- );
682
- height: var(
683
- --_ctm-mob-dn-pt-an-pt-an-et-dt-se-in-se,
684
- var(--_ctm-tab-dn-pt-an-pt-an-et-dt-se-in-se, var(--_ctm-dn-pt-an-pt-an-et-dt-se-in-se))
685
- );
632
+ width: var(--_ctm-mob-dn-pt-an-pt-an-et-dt-se-in-se,
633
+ var(--_ctm-tab-dn-pt-an-pt-an-et-dt-se-in-se, var(--_ctm-dn-pt-an-pt-an-et-dt-se-in-se)));
634
+ height: var(--_ctm-mob-dn-pt-an-pt-an-et-dt-se-in-se,
635
+ var(--_ctm-tab-dn-pt-an-pt-an-et-dt-se-in-se, var(--_ctm-dn-pt-an-pt-an-et-dt-se-in-se)));
636
+
686
637
  path {
687
638
  stroke: var(--_thm-cs-be-se-1);
688
639
  }
689
640
  }
641
+
690
642
  &:hover {
691
643
  svg {
692
- width: var(
693
- --_ctm-mob-dn-pt-an-pt-an-et-dt-se-in-se,
694
- var(
695
- --_ctm-tab-dn-pt-an-pt-an-et-dt-se-in-se,
696
- var(--_ctm-dn-pt-an-pt-an-et-dt-se-in-se)
697
- )
698
- );
699
- height: var(
700
- --_ctm-mob-dn-pt-an-pt-an-et-dt-se-in-se,
701
- var(
702
- --_ctm-tab-dn-pt-an-pt-an-et-dt-se-in-se,
703
- var(--_ctm-dn-pt-an-pt-an-et-dt-se-in-se)
704
- )
705
- );
644
+ width: var(--_ctm-mob-dn-pt-an-pt-an-et-dt-se-in-se,
645
+ var(--_ctm-tab-dn-pt-an-pt-an-et-dt-se-in-se,
646
+ var(--_ctm-dn-pt-an-pt-an-et-dt-se-in-se)));
647
+ height: var(--_ctm-mob-dn-pt-an-pt-an-et-dt-se-in-se,
648
+ var(--_ctm-tab-dn-pt-an-pt-an-et-dt-se-in-se,
649
+ var(--_ctm-dn-pt-an-pt-an-et-dt-se-in-se)));
650
+
706
651
  path {
707
652
  stroke: var(--_thm-cs-at-py);
708
653
  }
709
654
  }
710
655
  }
711
656
  }
657
+
712
658
  .wishlist_icon {
713
659
  cursor: pointer;
660
+
714
661
  svg {
715
- width: var(
716
- --_ctm-mob-dn-pt-an-pt-an-wt-in-se,
717
- var(--_ctm-tab-dn-pt-an-pt-an-wt-in-se, var(--_ctm-dn-pt-an-pt-an-wt-in-se))
718
- );
719
- height: var(
720
- --_ctm-mob-dn-pt-an-pt-an-wt-in-se,
721
- var(--_ctm-tab-dn-pt-an-pt-an-wt-in-se, var(--_ctm-dn-pt-an-pt-an-wt-in-se))
722
- );
662
+ width: var(--_ctm-mob-dn-pt-an-pt-an-wt-in-se,
663
+ var(--_ctm-tab-dn-pt-an-pt-an-wt-in-se, var(--_ctm-dn-pt-an-pt-an-wt-in-se)));
664
+ height: var(--_ctm-mob-dn-pt-an-pt-an-wt-in-se,
665
+ var(--_ctm-tab-dn-pt-an-pt-an-wt-in-se, var(--_ctm-dn-pt-an-pt-an-wt-in-se)));
666
+
723
667
  path {
724
668
  stroke: var(--_thm-cs-be-se-1);
725
669
  }
726
670
  }
671
+
727
672
  &:hover {
728
673
  svg {
729
- width: var(
730
- --_ctm-mob-dn-pt-an-pt-an-wt-in-se,
731
- var(--_ctm-tab-dn-pt-an-pt-an-wt-in-se, var(--_ctm-dn-pt-an-pt-an-wt-in-se))
732
- );
733
- height: var(
734
- --_ctm-mob-dn-pt-an-pt-an-wt-in-se,
735
- var(--_ctm-tab-dn-pt-an-pt-an-wt-in-se, var(--_ctm-dn-pt-an-pt-an-wt-in-se))
736
- );
674
+ width: var(--_ctm-mob-dn-pt-an-pt-an-wt-in-se,
675
+ var(--_ctm-tab-dn-pt-an-pt-an-wt-in-se, var(--_ctm-dn-pt-an-pt-an-wt-in-se)));
676
+ height: var(--_ctm-mob-dn-pt-an-pt-an-wt-in-se,
677
+ var(--_ctm-tab-dn-pt-an-pt-an-wt-in-se, var(--_ctm-dn-pt-an-pt-an-wt-in-se)));
678
+
737
679
  path {
738
680
  stroke: var(--_thm-cs-at-py);
739
681
  }
@@ -745,62 +687,59 @@ $input-padding: 10px 12px;
745
687
  cursor: pointer;
746
688
 
747
689
  svg {
748
- width: var(
749
- --_ctm-mob-dn-pt-an-pt-an-de-in-se,
750
- var(--_ctm-tab-dn-pt-an-pt-an-de-in-se, var(--_ctm-dn-pt-an-pt-an-de-in-se))
751
- );
752
- height: var(
753
- --_ctm-mob-dn-pt-an-pt-an-de-in-se,
754
- var(--_ctm-tab-dn-pt-an-pt-an-de-in-se, var(--_ctm-dn-pt-an-pt-an-de-in-se))
755
- );
690
+ width: var(--_ctm-mob-dn-pt-an-pt-an-de-in-se,
691
+ var(--_ctm-tab-dn-pt-an-pt-an-de-in-se, var(--_ctm-dn-pt-an-pt-an-de-in-se)));
692
+ height: var(--_ctm-mob-dn-pt-an-pt-an-de-in-se,
693
+ var(--_ctm-tab-dn-pt-an-pt-an-de-in-se, var(--_ctm-dn-pt-an-pt-an-de-in-se)));
694
+
756
695
  path {
757
- stroke: var(
758
- --_ctm-mob-dn-pt-an-pt-an-de-in-c1,
759
- var(--_ctm-tab-dn-pt-an-pt-an-de-in-c1, var(--_ctm-dn-pt-an-pt-an-de-in-c1))
760
- );
696
+ stroke: var(--_ctm-mob-dn-pt-an-pt-an-de-in-c1,
697
+ var(--_ctm-tab-dn-pt-an-pt-an-de-in-c1, var(--_ctm-dn-pt-an-pt-an-de-in-c1)));
761
698
  // Overrides the stroke-width presentation attribute baked into the icon markup.
762
699
  stroke-width: prepareMediaVariable(--_ctm-dn-pt-an-pt-an-de-se-wh, 1.25);
763
700
  }
764
701
  }
702
+
765
703
  &:hover {
766
704
  background-color: var(--_error-50);
705
+
767
706
  svg {
768
- width: var(
769
- --_ctm-mob-dn-pt-an-pt-an-de-in-se,
770
- var(--_ctm-tab-dn-pt-an-pt-an-de-in-se, var(--_ctm-dn-pt-an-pt-an-de-in-se))
771
- );
772
- height: var(
773
- --_ctm-mob-dn-pt-an-pt-an-de-in-se,
774
- var(--_ctm-tab-dn-pt-an-pt-an-de-in-se, var(--_ctm-dn-pt-an-pt-an-de-in-se))
775
- );
707
+ width: var(--_ctm-mob-dn-pt-an-pt-an-de-in-se,
708
+ var(--_ctm-tab-dn-pt-an-pt-an-de-in-se, var(--_ctm-dn-pt-an-pt-an-de-in-se)));
709
+ height: var(--_ctm-mob-dn-pt-an-pt-an-de-in-se,
710
+ var(--_ctm-tab-dn-pt-an-pt-an-de-in-se, var(--_ctm-dn-pt-an-pt-an-de-in-se)));
711
+
776
712
  path {
777
- stroke: var(
778
- --_ctm-mob-dn-pt-an-pt-an-de-in-c1,
779
- var(--_ctm-tab-dn-pt-an-pt-an-de-in-c1, var(--_ctm-dn-pt-an-pt-an-de-in-c1))
780
- );
713
+ stroke: var(--_ctm-mob-dn-pt-an-pt-an-de-in-c1,
714
+ var(--_ctm-tab-dn-pt-an-pt-an-de-in-c1, var(--_ctm-dn-pt-an-pt-an-de-in-c1)));
781
715
  }
782
716
  }
783
717
  }
784
718
  }
719
+
785
720
  .svg_icon {
786
721
  display: flex;
787
722
  justify-content: center;
788
723
  align-items: center;
789
724
  }
725
+
790
726
  .product_action_button {
791
727
  display: flex;
792
728
  justify-content: center;
793
729
  align-items: center;
794
730
  gap: 8px;
795
731
  }
732
+
796
733
  a {
797
734
  width: 33%;
798
735
  display: flex;
799
736
  justify-content: center;
800
737
  border-radius: 4px;
801
738
  padding: 4px !important;
739
+
802
740
  &:hover {
803
741
  background-color: color-mix(in srgb, var(--_thm-cs-at-py) 10%, transparent);
742
+
804
743
  svg {
805
744
  path {
806
745
  stroke: var(--_thm-cs-at-py);
@@ -808,28 +747,34 @@ $input-padding: 10px 12px;
808
747
  }
809
748
  }
810
749
  }
750
+
811
751
  button {
812
752
  display: flex;
813
753
  justify-content: center;
814
754
  border-radius: 4px;
815
755
  padding: 8px 16px !important;
816
756
  }
757
+
817
758
  span:has(.cart-dropdown-container) {
818
759
  width: 100%;
819
760
  display: flex;
820
761
  justify-content: center;
821
762
  border-radius: 4px;
763
+
822
764
  button {
823
765
  width: 100%;
824
766
  padding: 0 !important;
767
+
825
768
  span {
826
769
  display: flex;
827
770
  align-items: center;
828
771
  border-radius: 4px;
829
772
  }
830
773
  }
774
+
831
775
  &:hover {
832
776
  background-color: color-mix(in srgb, var(--_thm-cs-at-py) 10%, transparent);
777
+
833
778
  span {
834
779
  svg {
835
780
  path {
@@ -839,41 +784,38 @@ $input-padding: 10px 12px;
839
784
  }
840
785
  }
841
786
  }
787
+
842
788
  .line_divider {
843
789
  height: 12px;
844
790
  background: var(--_thm-cs-be-se-3);
845
791
  width: 1px;
846
792
  }
793
+
847
794
  .primary_link {
848
795
  display: flex;
849
796
  justify-content: center;
850
797
  align-items: center;
851
- color: var(
852
- --_sf-ft-clr,
853
- var(
854
- --_ctm-mob-ty-bs-dt-se-tt-cr,
855
- var(--_ctm-tab-ty-bs-dt-se-tt-cr, var(--_thm-ty-bs-dt-se-tt-cr, inherit))
856
- )
857
- ) !important;
798
+ color: var(--_sf-ft-clr,
799
+ var(--_ctm-mob-ty-bs-dt-se-tt-cr,
800
+ var(--_ctm-tab-ty-bs-dt-se-tt-cr, var(--_thm-ty-bs-dt-se-tt-cr, inherit)))) !important;
801
+
858
802
  span {
859
803
  svg {
860
804
  path {
861
- stroke: var(
862
- --_sf-ft-clr,
863
- var(
864
- --_ctm-mob-ty-bs-dt-se-tt-cr,
865
- var(--_ctm-tab-ty-bs-dt-se-tt-cr, var(--_thm-ty-bs-dt-se-tt-cr, inherit))
866
- )
867
- );
805
+ stroke: var(--_sf-ft-clr,
806
+ var(--_ctm-mob-ty-bs-dt-se-tt-cr,
807
+ var(--_ctm-tab-ty-bs-dt-se-tt-cr, var(--_thm-ty-bs-dt-se-tt-cr, inherit))));
868
808
  }
869
809
  }
870
810
  }
871
811
  }
812
+
872
813
  .destructive {
873
814
  color: var(--_gray-900);
874
815
  display: flex;
875
816
  align-items: center;
876
817
  justify-content: center;
818
+
877
819
  span {
878
820
  svg {
879
821
  path {
@@ -881,9 +823,11 @@ $input-padding: 10px 12px;
881
823
  }
882
824
  }
883
825
  }
826
+
884
827
  &:hover {
885
828
  color: var(--_error-500);
886
829
  background-color: var(--_error-50);
830
+
887
831
  span {
888
832
  svg {
889
833
  path {
@@ -901,10 +845,12 @@ $input-padding: 10px 12px;
901
845
  font-weight: 400;
902
846
  line-height: 24px;
903
847
  }
848
+
904
849
  .remove-btn {
905
850
  color: var(--_error-500);
906
851
  padding: 8px 16px;
907
852
  border-radius: 4px;
853
+
908
854
  &:hover {
909
855
  background: var(--_error-50);
910
856
  }
@@ -916,7 +862,8 @@ $input-padding: 10px 12px;
916
862
  from {
917
863
  transform: rotate(0deg);
918
864
  }
865
+
919
866
  to {
920
867
  transform: rotate(360deg);
921
868
  }
922
- }
869
+ }