@sc-360-v2/storefront-cms-library 0.5.72 → 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 (124) 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/bundleDetails.scss +3774 -5072
  18. package/dist/button.scss +79 -103
  19. package/dist/buy-for-tab-container.scss +77 -106
  20. package/dist/buyForHeaders.scss +1722 -2976
  21. package/dist/cart-details.scss +481 -1012
  22. package/dist/cart-summary.scss +557 -1149
  23. package/dist/cart-wrapper.scss +37 -79
  24. package/dist/cart.scss +117 -225
  25. package/dist/cartAttributes.scss +416 -735
  26. package/dist/category-groups-element.scss +127 -108
  27. package/dist/category-groups-product-grid.scss +120 -147
  28. package/dist/category-groups-product-image.scss +1162 -1457
  29. package/dist/category-groups-product-options.scss +613 -680
  30. package/dist/category-groups-product-price.scss +1966 -3244
  31. package/dist/category-groups-quota-details.scss +210 -464
  32. package/dist/category.scss +26 -50
  33. package/dist/checkout.scss +24 -16
  34. package/dist/confirm-modal.scss +22 -2
  35. package/dist/container.scss +32 -54
  36. package/dist/countdown.scss +255 -443
  37. package/dist/coupon.scss +351 -710
  38. package/dist/default-dropdown.scss +12 -1
  39. package/dist/embroider-template-1-v2.scss +123 -172
  40. package/dist/embroider-template-1.scss +68 -104
  41. package/dist/embroidery.scss +30 -31
  42. package/dist/employee-bulk-order.scss +418 -142
  43. package/dist/faq.scss +228 -408
  44. package/dist/filter-results.scss +125 -265
  45. package/dist/filters.scss +900 -1797
  46. package/dist/gallery-slider-temp.scss +432 -750
  47. package/dist/global-styles.scss +218 -198
  48. package/dist/grid.scss +25 -33
  49. package/dist/hotspot.scss +68 -115
  50. package/dist/image-temp.scss +21 -20
  51. package/dist/item-stock.scss +9 -16
  52. package/dist/kitDetails.scss +2719 -4299
  53. package/dist/kits.scss +24 -19
  54. package/dist/language-selector.scss +211 -361
  55. package/dist/last-x-orders.scss +95 -174
  56. package/dist/layouter-item.scss +75 -103
  57. package/dist/layouter-pro-item.scss +89 -95
  58. package/dist/layouter-pro.scss +87 -92
  59. package/dist/layouter.scss +383 -445
  60. package/dist/light-box-v2.scss +89 -104
  61. package/dist/login.scss +287 -566
  62. package/dist/map.scss +221 -368
  63. package/dist/marchandiserSets.scss +95 -104
  64. package/dist/mega-menu-container.scss +96 -109
  65. package/dist/mega-menu.scss +624 -731
  66. package/dist/menu-item.scss +2 -2
  67. package/dist/menu-v2.scss +507 -619
  68. package/dist/multi-select-dropdown.scss +27 -3
  69. package/dist/my-templates.scss +38 -9
  70. package/dist/option-bar.scss +215 -375
  71. package/dist/order-status.scss +646 -1117
  72. package/dist/overflow-module.scss +6 -7
  73. package/dist/past-orders.scss +118 -149
  74. package/dist/payment-methods.scss +46 -30
  75. package/dist/pickup-locations.scss +558 -1118
  76. package/dist/position-module.scss +20 -17
  77. package/dist/prefix-list.scss +21 -10
  78. package/dist/product-actions.scss +1750 -2055
  79. package/dist/product-basic-elements.scss +108 -169
  80. package/dist/product-highlights.scss +107 -152
  81. package/dist/product-image-bundles.scss +337 -642
  82. package/dist/product-inventory.scss +673 -1357
  83. package/dist/product-labels.scss +84 -105
  84. package/dist/product-options.scss +1117 -1274
  85. package/dist/product-price.scss +1283 -2561
  86. package/dist/product-promotions.scss +1388 -2830
  87. package/dist/product-sizechart.scss +516 -905
  88. package/dist/product.scss +28 -61
  89. package/dist/productDetails.scss +19 -39
  90. package/dist/profile.scss +207 -447
  91. package/dist/quantity-selector.scss +837 -1074
  92. package/dist/quick-inventory-check.scss +95 -174
  93. package/dist/quick-links.scss +55 -133
  94. package/dist/quick-order-pad.scss +218 -271
  95. package/dist/quota-details.scss +152 -282
  96. package/dist/quotes.scss +89 -122
  97. package/dist/repeater-embla-controls.scss +35 -15
  98. package/dist/repeater-grid-toggle.scss +156 -166
  99. package/dist/repeater-item.scss +41 -64
  100. package/dist/repeater.scss +671 -814
  101. package/dist/request-for-quotes.scss +66 -16
  102. package/dist/responsive-behaviour.scss +3 -1
  103. package/dist/rfqs.scss +118 -181
  104. package/dist/scroll.scss +93 -172
  105. package/dist/search.scss +179 -326
  106. package/dist/section.scss +27 -51
  107. package/dist/shipping-payments.scss +198 -58
  108. package/dist/simple-list.scss +74 -164
  109. package/dist/social.scss +80 -145
  110. package/dist/sort.scss +11 -19
  111. package/dist/stack.scss +23 -34
  112. package/dist/static-global.scss +44 -26
  113. package/dist/stockStatus.scss +11 -19
  114. package/dist/store-locations.scss +577 -1105
  115. package/dist/tab-container.scss +81 -108
  116. package/dist/table-common.scss +217 -408
  117. package/dist/table.scss +271 -502
  118. package/dist/text-temp.scss +8 -7
  119. package/dist/theme-classes.scss +17 -13
  120. package/dist/uom-selector.scss +489 -949
  121. package/dist/user-elements.scss +529 -837
  122. package/dist/variant-picker.scss +1281 -2555
  123. package/dist/volume-pricing.scss +541 -1037
  124. package/package.json +1 -1
package/dist/quick-order-pad.scss CHANGED
@@ -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
+ }