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

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 (141) hide show
  1. package/dist/add-existing-form.scss +5 -13
  2. package/dist/add-order.scss +236 -126
  3. package/dist/add-products-tab-details.scss +2097 -1048
  4. package/dist/add-products-tab.scss +1204 -666
  5. package/dist/allocation-header-quota-details.scss +407 -189
  6. package/dist/allocationDetails.scss +2143 -1661
  7. package/dist/allocations-quota-details.scss +323 -159
  8. package/dist/allocations.scss +793 -475
  9. package/dist/amount-estimator.scss +743 -405
  10. package/dist/badge.scss +18 -43
  11. package/dist/brand-basic-elements.scss +124 -76
  12. package/dist/brand.scss +55 -28
  13. package/dist/breadcrumbs.scss +718 -356
  14. package/dist/builder.js +1 -1
  15. package/dist/builderLite.js +1 -1
  16. package/dist/bulk-variant-picker.scss +2027 -1128
  17. package/dist/bundle.scss +1477 -841
  18. package/dist/bundleDetails.scss +5072 -3774
  19. package/dist/button.scss +103 -79
  20. package/dist/buy-for-tab-container.scss +106 -77
  21. package/dist/buyForHeaders.scss +2976 -1722
  22. package/dist/cart-details.scss +1012 -481
  23. package/dist/cart-summary.scss +1149 -557
  24. package/dist/cart-wrapper.scss +79 -37
  25. package/dist/cart.scss +225 -117
  26. package/dist/cartAttributes.scss +735 -416
  27. package/dist/category-groups-element.scss +108 -127
  28. package/dist/category-groups-product-grid.scss +147 -120
  29. package/dist/category-groups-product-image.scss +1457 -1162
  30. package/dist/category-groups-product-options.scss +680 -613
  31. package/dist/category-groups-product-price.scss +3244 -1966
  32. package/dist/category-groups-quota-details.scss +464 -210
  33. package/dist/category.scss +50 -26
  34. package/dist/checkout.scss +16 -24
  35. package/dist/confirm-modal.scss +2 -22
  36. package/dist/container.scss +54 -32
  37. package/dist/countdown.scss +443 -255
  38. package/dist/coupon.scss +710 -351
  39. package/dist/default-dropdown.scss +1 -12
  40. package/dist/embroider-template-1-v2.scss +172 -123
  41. package/dist/embroider-template-1.scss +104 -68
  42. package/dist/embroidery.scss +31 -30
  43. package/dist/employee-bulk-order.scss +142 -418
  44. package/dist/faq.scss +408 -228
  45. package/dist/filter-results.scss +265 -125
  46. package/dist/filters.scss +1797 -900
  47. package/dist/gallery-slider-temp.scss +750 -432
  48. package/dist/global-styles.scss +7 -23
  49. package/dist/grid.scss +33 -25
  50. package/dist/hotspot.scss +115 -68
  51. package/dist/icons-builder.js +1 -1
  52. package/dist/icons-website.js +1 -1
  53. package/dist/icons.js +1 -1
  54. package/dist/image-temp.scss +20 -21
  55. package/dist/index.js +1 -1
  56. package/dist/item-stock.scss +16 -9
  57. package/dist/kitDetails.scss +4301 -2721
  58. package/dist/kits.scss +19 -24
  59. package/dist/language-selector.scss +361 -211
  60. package/dist/last-x-orders.scss +174 -95
  61. package/dist/layouter-item.scss +103 -75
  62. package/dist/layouter-pro-item.scss +95 -89
  63. package/dist/layouter-pro.scss +92 -87
  64. package/dist/layouter.scss +445 -383
  65. package/dist/light-box-v2.scss +104 -89
  66. package/dist/login.scss +566 -287
  67. package/dist/map.scss +368 -221
  68. package/dist/marchandiserSets.scss +104 -95
  69. package/dist/mega-menu-container.scss +109 -96
  70. package/dist/mega-menu.scss +731 -624
  71. package/dist/menu-item.scss +2 -2
  72. package/dist/menu-v2.scss +619 -507
  73. package/dist/multi-select-dropdown.scss +3 -27
  74. package/dist/my-templates.scss +9 -38
  75. package/dist/option-bar.scss +375 -215
  76. package/dist/option-families.scss +252 -0
  77. package/dist/order-status.scss +1117 -646
  78. package/dist/overflow-module.scss +7 -6
  79. package/dist/past-orders.scss +149 -118
  80. package/dist/payment-methods.scss +30 -46
  81. package/dist/pickup-locations.scss +1118 -558
  82. package/dist/position-module.scss +17 -20
  83. package/dist/prefix-list.scss +10 -21
  84. package/dist/product-actions.scss +2425 -1625
  85. package/dist/product-basic-elements.scss +169 -108
  86. package/dist/product-highlights.scss +152 -107
  87. package/dist/product-image-bundles.scss +642 -337
  88. package/dist/product-inventory.scss +1357 -673
  89. package/dist/product-labels.scss +105 -84
  90. package/dist/product-options.scss +1274 -1117
  91. package/dist/product-price.scss +2561 -1283
  92. package/dist/product-promotions.scss +2830 -1388
  93. package/dist/product-sizechart.scss +905 -516
  94. package/dist/product.scss +61 -28
  95. package/dist/productDetails.scss +39 -19
  96. package/dist/profile.scss +447 -207
  97. package/dist/quantity-selector.scss +550 -313
  98. package/dist/quick-inventory-check.scss +174 -95
  99. package/dist/quick-links.scss +133 -55
  100. package/dist/quick-order-pad.scss +271 -218
  101. package/dist/quota-details.scss +282 -152
  102. package/dist/quotes.scss +122 -89
  103. package/dist/repeater-embla-controls.scss +15 -35
  104. package/dist/repeater-grid-toggle.scss +166 -156
  105. package/dist/repeater-item.scss +64 -41
  106. package/dist/repeater.scss +814 -671
  107. package/dist/request-for-quotes.scss +16 -66
  108. package/dist/responsive-behaviour.scss +1 -3
  109. package/dist/rfqs.scss +181 -118
  110. package/dist/scroll.scss +172 -93
  111. package/dist/search.scss +326 -179
  112. package/dist/section.scss +51 -27
  113. package/dist/shipping-payments.scss +58 -198
  114. package/dist/simple-list.scss +164 -74
  115. package/dist/social.scss +145 -80
  116. package/dist/sort.scss +19 -11
  117. package/dist/stack.scss +34 -23
  118. package/dist/static-global.scss +26 -44
  119. package/dist/stockStatus.scss +19 -11
  120. package/dist/store-locations.scss +1105 -577
  121. package/dist/tab-container.scss +108 -81
  122. package/dist/table-common.scss +408 -217
  123. package/dist/table.scss +502 -271
  124. package/dist/text-temp.scss +7 -8
  125. package/dist/theme-classes.scss +13 -17
  126. package/dist/types/builder/enums/data-connectors.d.ts +3 -1
  127. package/dist/types/builder/enums/index.d.ts +3 -1
  128. package/dist/types/builder/tools/element-edit/index.d.ts +2 -1
  129. package/dist/types/builder/tools/element-edit/optionFamilies.d.ts +20 -0
  130. package/dist/types/builder/tools/element-edit/productActions.d.ts +3 -0
  131. package/dist/types/website/constants/data-connector-souces.d.ts +40 -8
  132. package/dist/types/website/constants/data-connectors.d.ts +12 -1
  133. package/dist/types/website/helper/ssr-functions.d.ts +8 -0
  134. package/dist/uom-selector.scss +949 -489
  135. package/dist/uploadMedia.js +1 -1
  136. package/dist/user-elements.scss +837 -529
  137. package/dist/variant-picker.scss +2555 -1281
  138. package/dist/volume-pricing.scss +1037 -541
  139. package/dist/website.js +1 -1
  140. package/dist/widget.scss +1 -0
  141. package/package.json +1 -1
@@ -4,37 +4,66 @@
4
4
 
5
5
  $resizerId: "[data-cms-tool='cms-element-resizer']";
6
6
  $resizeActive: '[data-cms-element-resizer="true"]';
7
-
8
7
  [data-div-type="element"] {
9
8
  &[data-element-type="breadcrumbs"] {
10
- width: var(--_sf-el-wh-st-mx,
11
- calc(1% * var(--_ctm-mob-ele-nw-wh-vl,
12
- var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))))));
9
+ width: var(
10
+ --_sf-el-wh-st-mx,
11
+ calc(
12
+ 1% *
13
+ var(
14
+ --_ctm-mob-ele-nw-wh-vl,
15
+ var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh)))
16
+ )
17
+ )
18
+ );
13
19
  min-width: 200px !important;
14
20
 
15
21
  margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));
16
22
 
17
- &>div {
23
+ & > div {
18
24
  &.wrapper {
19
25
  min-width: 200px !important;
20
26
  width: 100%;
21
- background-color: var(--_ctm-mob-dn-bd-ad-fl-bd-cr,
22
- var(--_ctm-tab-dn-bd-ad-fl-bd-cr, var(--_ctm-dn-bd-ad-fl-bd-cr)));
23
- border-style: var(--_ctm-mob-dn-bd-ad-fl-br-se,
24
- var(--_ctm-tab-dn-bd-ad-fl-br-se, var(--_ctm-dn-bd-ad-fl-br-se)));
25
- border-width: var(--_ctm-mob-dn-bd-ad-fl-br-wh,
26
- var(--_ctm-tab-dn-bd-ad-fl-br-wh, var(--_ctm-dn-bd-ad-fl-br-wh)));
27
- border-color: var(--_ctm-mob-dn-bd-ad-fl-br-cr,
28
- var(--_ctm-tab-dn-bd-ad-fl-br-cr, var(--_ctm-dn-bd-ad-fl-br-cr)));
29
- border-radius: var(--_ctm-mob-dn-bd-ad-fl-br-rs,
30
- var(--_ctm-tab-dn-bd-ad-fl-br-rs, var(--_ctm-dn-bd-ad-fl-br-rs)));
31
-
32
- box-shadow: var(--_show-shadow,
33
- var(--_ctm-mob-dn-bd-ad-fl-sw-ae,
34
- var(--_ctm-tab-dn-bd-ad-fl-sw-ae, var(--_ctm-dn-bd-ad-fl-sw-ae))) var(--_ctm-mob-dn-bd-ad-fl-sw-br,
35
- var(--_ctm-tab-dn-bd-ad-fl-sw-br, var(--_ctm-dn-bd-ad-fl-sw-br))) var(--_ctm-mob-dn-bd-ad-fl-sw-sd,
36
- var(--_ctm-tab-dn-bd-ad-fl-sw-sd, var(--_ctm-dn-bd-ad-fl-sw-sd))) var(--_ctm-mob-dn-bd-ad-fl-sw-cr,
37
- var(--_ctm-tab-dn-bd-ad-fl-sw-cr, var(--_ctm-dn-bd-ad-fl-sw-cr))));
27
+ background-color: var(
28
+ --_ctm-mob-dn-bd-ad-fl-bd-cr,
29
+ var(--_ctm-tab-dn-bd-ad-fl-bd-cr, var(--_ctm-dn-bd-ad-fl-bd-cr))
30
+ );
31
+ border-style: var(
32
+ --_ctm-mob-dn-bd-ad-fl-br-se,
33
+ var(--_ctm-tab-dn-bd-ad-fl-br-se, var(--_ctm-dn-bd-ad-fl-br-se))
34
+ );
35
+ border-width: var(
36
+ --_ctm-mob-dn-bd-ad-fl-br-wh,
37
+ var(--_ctm-tab-dn-bd-ad-fl-br-wh, var(--_ctm-dn-bd-ad-fl-br-wh))
38
+ );
39
+ border-color: var(
40
+ --_ctm-mob-dn-bd-ad-fl-br-cr,
41
+ var(--_ctm-tab-dn-bd-ad-fl-br-cr, var(--_ctm-dn-bd-ad-fl-br-cr))
42
+ );
43
+ border-radius: var(
44
+ --_ctm-mob-dn-bd-ad-fl-br-rs,
45
+ var(--_ctm-tab-dn-bd-ad-fl-br-rs, var(--_ctm-dn-bd-ad-fl-br-rs))
46
+ );
47
+
48
+ box-shadow: var(
49
+ --_show-shadow,
50
+ var(
51
+ --_ctm-mob-dn-bd-ad-fl-sw-ae,
52
+ var(--_ctm-tab-dn-bd-ad-fl-sw-ae, var(--_ctm-dn-bd-ad-fl-sw-ae))
53
+ )
54
+ var(
55
+ --_ctm-mob-dn-bd-ad-fl-sw-br,
56
+ var(--_ctm-tab-dn-bd-ad-fl-sw-br, var(--_ctm-dn-bd-ad-fl-sw-br))
57
+ )
58
+ var(
59
+ --_ctm-mob-dn-bd-ad-fl-sw-sd,
60
+ var(--_ctm-tab-dn-bd-ad-fl-sw-sd, var(--_ctm-dn-bd-ad-fl-sw-sd))
61
+ )
62
+ var(
63
+ --_ctm-mob-dn-bd-ad-fl-sw-cr,
64
+ var(--_ctm-tab-dn-bd-ad-fl-sw-cr, var(--_ctm-dn-bd-ad-fl-sw-cr))
65
+ )
66
+ );
38
67
  }
39
68
 
40
69
  .breadcrumb_item {
@@ -59,8 +88,10 @@ $resizeActive: '[data-cms-element-resizer="true"]';
59
88
 
60
89
  &[overflow-item="Wrap"] {
61
90
  flex-wrap: wrap;
62
- row-gap: var(--_ctm-mob-lt-im-vl-sg,
63
- var(--_ctm-tab-lt-im-vl-sg, var(--_ctm-lt-im-vl-sg)));
91
+ row-gap: var(
92
+ --_ctm-mob-lt-im-vl-sg,
93
+ var(--_ctm-tab-lt-im-vl-sg, var(--_ctm-lt-im-vl-sg))
94
+ );
64
95
  column-gap: var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg)));
65
96
  }
66
97
 
@@ -71,67 +102,119 @@ $resizeActive: '[data-cms-element-resizer="true"]';
71
102
  white-space: nowrap;
72
103
  align-items: center;
73
104
 
74
- padding: var(--_ctm-mob-dn-or-im-se-pg,
75
- var(--_ctm-tab-dn-or-im-se-pg, var(--_ctm-dn-or-im-se-pg)));
76
- gap: var(--_ctm-mob-dn-or-im-se-im-gp,
77
- var(--_ctm-tab-dn-or-im-se-im-gp, var(--_ctm-dn-or-im-se-im-gp)));
78
-
79
- background-color: var(--_ctm-mob-dn-or-im-se-bd-cr,
80
- var(--_ctm-tab-dn-or-im-se-bd-cr, var(--_ctm-dn-or-im-se-bd-cr)));
81
- border-color: var(--_ctm-mob-dn-or-im-se-br-cr,
82
- var(--_ctm-tab-dn-or-im-se-br-cr, var(--_ctm-dn-or-im-se-br-cr)));
83
- border-radius: var(--_ctm-mob-dn-or-im-se-br-rs,
84
- var(--_ctm-tab-dn-or-im-se-br-rs, var(--_ctm-dn-or-im-se-br-rs)));
85
- border-style: var(--_ctm-mob-dn-or-im-se-br-se,
86
- var(--_ctm-tab-dn-or-im-se-br-se, var(--_ctm-dn-or-im-se-br-se)));
87
- border-width: var(--_ctm-mob-dn-or-im-se-br-wh,
88
- var(--_ctm-tab-dn-or-im-se-br-wh, var(--_ctm-dn-or-im-se-br-wh)));
89
- color: var(--_ctm-mob-dn-or-im-se-cr,
90
- var(--_ctm-tab-dn-or-im-se-cr, var(--_ctm-dn-or-im-se-cr)));
91
- font-family: var(--_ctm-mob-dn-or-im-se-ft-fy,
92
- var(--_ctm-tab-dn-or-im-se-ft-fy, var(--_ctm-dn-or-im-se-ft-fy)));
93
-
105
+ padding: var(
106
+ --_ctm-mob-dn-or-im-se-pg,
107
+ var(--_ctm-tab-dn-or-im-se-pg, var(--_ctm-dn-or-im-se-pg))
108
+ );
109
+ gap: var(
110
+ --_ctm-mob-dn-or-im-se-im-gp,
111
+ var(--_ctm-tab-dn-or-im-se-im-gp, var(--_ctm-dn-or-im-se-im-gp))
112
+ );
113
+
114
+ background-color: var(
115
+ --_ctm-mob-dn-or-im-se-bd-cr,
116
+ var(--_ctm-tab-dn-or-im-se-bd-cr, var(--_ctm-dn-or-im-se-bd-cr))
117
+ );
118
+ border-color: var(
119
+ --_ctm-mob-dn-or-im-se-br-cr,
120
+ var(--_ctm-tab-dn-or-im-se-br-cr, var(--_ctm-dn-or-im-se-br-cr))
121
+ );
122
+ border-radius: var(
123
+ --_ctm-mob-dn-or-im-se-br-rs,
124
+ var(--_ctm-tab-dn-or-im-se-br-rs, var(--_ctm-dn-or-im-se-br-rs))
125
+ );
126
+ border-style: var(
127
+ --_ctm-mob-dn-or-im-se-br-se,
128
+ var(--_ctm-tab-dn-or-im-se-br-se, var(--_ctm-dn-or-im-se-br-se))
129
+ );
130
+ border-width: var(
131
+ --_ctm-mob-dn-or-im-se-br-wh,
132
+ var(--_ctm-tab-dn-or-im-se-br-wh, var(--_ctm-dn-or-im-se-br-wh))
133
+ );
134
+ color: var(
135
+ --_ctm-mob-dn-or-im-se-cr,
136
+ var(--_ctm-tab-dn-or-im-se-cr, var(--_ctm-dn-or-im-se-cr))
137
+ );
138
+ font-family: var(
139
+ --_ctm-mob-dn-or-im-se-ft-fy,
140
+ var(--_ctm-tab-dn-or-im-se-ft-fy, var(--_ctm-dn-or-im-se-ft-fy))
141
+ );
94
142
  &.flex__overflow {
95
143
  white-space: normal;
96
144
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
97
145
  }
98
-
99
- font-size: var(--_ctm-mob-dn-or-im-se-ft-se,
100
- var(--_ctm-tab-dn-or-im-se-ft-se, var(--_ctm-dn-or-im-se-ft-se)));
101
- font-style: var(--_ctm-mob-dn-or-im-se-ft-se-ic,
102
- var(--_ctm-tab-dn-or-im-se-ft-se-ic, var(--_ctm-dn-or-im-se-ft-se-ic)));
103
- font-weight: var(--_ctm-mob-dn-or-im-se-ft-wt,
104
- var(--_ctm-tab-dn-or-im-se-ft-wt, var(--_ctm-dn-or-im-se-ft-wt)));
105
- line-height: var(--_ctm-mob-dn-or-im-se-le-ht,
106
- var(--_ctm-tab-dn-or-im-se-le-ht, var(--_ctm-dn-or-im-se-le-ht)));
107
- letter-spacing: var(--_ctm-mob-dn-or-im-se-lr-sg,
108
- var(--_ctm-tab-dn-or-im-se-lr-sg, var(--_ctm-dn-or-im-se-lr-sg)));
109
- text-align: var(--_ctm-mob-dn-or-im-se-tt-an,
110
- var(--_ctm-tab-dn-or-im-se-tt-an, var(--_ctm-dn-or-im-se-tt-an)));
111
- text-decoration: var(--_ctm-mob-dn-or-im-se-ue,
112
- var(--_ctm-tab-dn-or-im-se-ue, var(--_ctm-dn-or-im-se-ue)));
113
- text-transform: var(--_ctm-mob-dn-or-im-se-tt-tm,
114
- var(--_ctm-tab-dn-or-im-se-tt-tm, var(--_ctm-dn-or-im-se-tt-tm, none)));
115
- word-wrap: var(--_ctm-mob-dn-or-im-se-wd-wp,
116
- var(--_ctm-tab-dn-or-im-se-wd-wp, var(--_ctm-dn-or-im-se-wd-wp, normal)));
117
- word-break: var(--_ctm-mob-dn-or-im-se-wd-bk,
118
- var(--_ctm-tab-dn-or-im-se-wd-bk, var(--_ctm-dn-or-im-se-wd-bk, normal)));
119
- box-shadow: var(--_ctm-mob-dn-or-im-se-sw-ae,
120
- var(--_ctm-tab-dn-or-im-se-sw-ae, var(--_ctm-dn-or-im-se-sw-ae))) var(--_ctm-mob-dn-or-im-se-sw-br,
121
- var(--_ctm-tab-dn-or-im-se-sw-br, var(--_ctm-dn-or-im-se-sw-br))) var(--_ctm-mob-dn-or-im-se-sw-sd,
122
- var(--_ctm-tab-dn-or-im-se-sw-sd, var(--_ctm-dn-or-im-se-sw-sd))) var(--_ctm-mob-dn-or-im-se-sw-cr,
123
- var(--_ctm-tab-dn-or-im-se-sw-cr, var(--_ctm-dn-or-im-se-sw-cr)));
146
+ font-size: var(
147
+ --_ctm-mob-dn-or-im-se-ft-se,
148
+ var(--_ctm-tab-dn-or-im-se-ft-se, var(--_ctm-dn-or-im-se-ft-se))
149
+ );
150
+ font-style: var(
151
+ --_ctm-mob-dn-or-im-se-ft-se-ic,
152
+ var(--_ctm-tab-dn-or-im-se-ft-se-ic, var(--_ctm-dn-or-im-se-ft-se-ic))
153
+ );
154
+ font-weight: var(
155
+ --_ctm-mob-dn-or-im-se-ft-wt,
156
+ var(--_ctm-tab-dn-or-im-se-ft-wt, var(--_ctm-dn-or-im-se-ft-wt))
157
+ );
158
+ line-height: var(
159
+ --_ctm-mob-dn-or-im-se-le-ht,
160
+ var(--_ctm-tab-dn-or-im-se-le-ht, var(--_ctm-dn-or-im-se-le-ht))
161
+ );
162
+ letter-spacing: var(
163
+ --_ctm-mob-dn-or-im-se-lr-sg,
164
+ var(--_ctm-tab-dn-or-im-se-lr-sg, var(--_ctm-dn-or-im-se-lr-sg))
165
+ );
166
+ text-align: var(
167
+ --_ctm-mob-dn-or-im-se-tt-an,
168
+ var(--_ctm-tab-dn-or-im-se-tt-an, var(--_ctm-dn-or-im-se-tt-an))
169
+ );
170
+ text-decoration: var(
171
+ --_ctm-mob-dn-or-im-se-ue,
172
+ var(--_ctm-tab-dn-or-im-se-ue, var(--_ctm-dn-or-im-se-ue))
173
+ );
174
+ text-transform: var(
175
+ --_ctm-mob-dn-or-im-se-tt-tm,
176
+ var(--_ctm-tab-dn-or-im-se-tt-tm, var(--_ctm-dn-or-im-se-tt-tm, none))
177
+ );
178
+ word-wrap: var(
179
+ --_ctm-mob-dn-or-im-se-wd-wp,
180
+ var(--_ctm-tab-dn-or-im-se-wd-wp, var(--_ctm-dn-or-im-se-wd-wp, normal))
181
+ );
182
+ word-break: var(
183
+ --_ctm-mob-dn-or-im-se-wd-bk,
184
+ var(--_ctm-tab-dn-or-im-se-wd-bk, var(--_ctm-dn-or-im-se-wd-bk, normal))
185
+ );
186
+ box-shadow: var(
187
+ --_ctm-mob-dn-or-im-se-sw-ae,
188
+ var(--_ctm-tab-dn-or-im-se-sw-ae, var(--_ctm-dn-or-im-se-sw-ae))
189
+ )
190
+ var(
191
+ --_ctm-mob-dn-or-im-se-sw-br,
192
+ var(--_ctm-tab-dn-or-im-se-sw-br, var(--_ctm-dn-or-im-se-sw-br))
193
+ )
194
+ var(
195
+ --_ctm-mob-dn-or-im-se-sw-sd,
196
+ var(--_ctm-tab-dn-or-im-se-sw-sd, var(--_ctm-dn-or-im-se-sw-sd))
197
+ )
198
+ var(
199
+ --_ctm-mob-dn-or-im-se-sw-cr,
200
+ var(--_ctm-tab-dn-or-im-se-sw-cr, var(--_ctm-dn-or-im-se-sw-cr))
201
+ );
124
202
 
125
203
  .icon {
126
204
  svg {
127
- width: var(--_ctm-mob-dn-or-im-se-in-se,
128
- var(--_ctm-tab-dn-or-im-se-in-se, var(--_ctm-dn-or-im-se-in-se)));
129
- height: var(--_ctm-mob-dn-or-im-se-in-se,
130
- var(--_ctm-tab-dn-or-im-se-in-se, var(--_ctm-dn-or-im-se-in-se)));
131
-
205
+ width: var(
206
+ --_ctm-mob-dn-or-im-se-in-se,
207
+ var(--_ctm-tab-dn-or-im-se-in-se, var(--_ctm-dn-or-im-se-in-se))
208
+ );
209
+ height: var(
210
+ --_ctm-mob-dn-or-im-se-in-se,
211
+ var(--_ctm-tab-dn-or-im-se-in-se, var(--_ctm-dn-or-im-se-in-se))
212
+ );
132
213
  path {
133
- stroke: var(--_ctm-mob-dn-or-im-se-in-c1,
134
- var(--_ctm-tab-dn-or-im-se-in-c1, var(--_ctm-dn-or-im-se-in-c1)));
214
+ stroke: var(
215
+ --_ctm-mob-dn-or-im-se-in-c1,
216
+ var(--_ctm-tab-dn-or-im-se-in-c1, var(--_ctm-dn-or-im-se-in-c1))
217
+ );
135
218
  // Overrides the stroke-width presentation attribute baked into the icon markup.
136
219
  stroke-width: prepareMediaVariable(--_ctm-dn-or-im-se-se-wh, 1.25);
137
220
  }
@@ -139,60 +222,114 @@ $resizeActive: '[data-cms-element-resizer="true"]';
139
222
  }
140
223
 
141
224
  &:first-of-type {
142
- padding: var(--_ctm-mob-dn-he-pe-im-se-pg,
143
- var(--_ctm-tab-dn-he-pe-im-se-pg, var(--_ctm-dn-he-pe-im-se-pg)));
144
- gap: var(--_ctm-mob-dn-he-pe-im-se-im-gp,
145
- var(--_ctm-tab-dn-he-pe-im-se-im-gp, var(--_ctm-dn-he-pe-im-se-im-gp)));
146
- background-color: var(--_ctm-mob-dn-he-pe-im-se-bd-cr,
147
- var(--_ctm-tab-dn-he-pe-im-se-bd-cr, var(--_ctm-dn-he-pe-im-se-bd-cr)));
148
- border-color: var(--_ctm-mob-dn-he-pe-im-se-br-cr,
149
- var(--_ctm-tab-dn-he-pe-im-se-br-cr, var(--_ctm-dn-he-pe-im-se-br-cr)));
150
- border-radius: var(--_ctm-mob-dn-he-pe-im-se-br-rs,
151
- var(--_ctm-tab-dn-he-pe-im-se-br-rs, var(--_ctm-dn-he-pe-im-se-br-rs)));
152
- border-style: var(--_ctm-mob-dn-he-pe-im-se-br-se,
153
- var(--_ctm-tab-dn-he-pe-im-se-br-se, var(--_ctm-dn-he-pe-im-se-br-se)));
154
- border-width: var(--_ctm-mob-dn-he-pe-im-se-br-wh,
155
- var(--_ctm-tab-dn-he-pe-im-se-br-wh, var(--_ctm-dn-he-pe-im-se-br-wh)));
156
- color: var(--_ctm-mob-dn-he-pe-im-se-cr,
157
- var(--_ctm-tab-dn-he-pe-im-se-cr, var(--_ctm-dn-he-pe-im-se-cr)));
158
- font-family: var(--_ctm-mob-dn-he-pe-im-se-ft-fy,
159
- var(--_ctm-tab-dn-he-pe-im-se-ft-fy, var(--_ctm-dn-he-pe-im-se-ft-fy)));
160
- font-size: var(--_ctm-mob-dn-he-pe-im-se-ft-se,
161
- var(--_ctm-tab-dn-he-pe-im-se-ft-se, var(--_ctm-dn-he-pe-im-se-ft-se)));
162
- font-style: var(--_ctm-mob-dn-he-pe-im-se-ft-se-ic,
163
- var(--_ctm-tab-dn-he-pe-im-se-ft-se-ic, var(--_ctm-dn-he-pe-im-se-ft-se-ic)));
164
- font-weight: var(--_ctm-mob-dn-he-pe-im-se-ft-wt,
165
- var(--_ctm-tab-dn-he-pe-im-se-ft-wt, var(--_ctm-dn-he-pe-im-se-ft-wt)));
166
- line-height: var(--_ctm-mob-dn-he-pe-im-se-le-ht,
167
- var(--_ctm-tab-dn-he-pe-im-se-le-ht, var(--_ctm-dn-he-pe-im-se-le-ht)));
168
- letter-spacing: var(--_ctm-mob-dn-he-pe-im-se-lr-sg,
169
- var(--_ctm-tab-dn-he-pe-im-se-lr-sg, var(--_ctm-dn-he-pe-im-se-lr-sg)));
170
- text-align: var(--_ctm-mob-dn-he-pe-im-se-tt-an,
171
- var(--_ctm-tab-dn-he-pe-im-se-tt-an, var(--_ctm-dn-he-pe-im-se-tt-an)));
172
- text-decoration: var(--_ctm-mob-dn-he-pe-im-se-ue,
173
- var(--_ctm-tab-dn-he-pe-im-se-ue, var(--_ctm-dn-he-pe-im-se-ue)));
174
- text-transform: var(--_ctm-mob-dn-he-pe-im-se-tt-tm,
175
- var(--_ctm-tab-dn-he-pe-im-se-tt-tm, var(--_ctm-dn-he-pe-im-se-tt-tm, none)));
176
- word-wrap: var(--_ctm-mob-dn-he-pe-im-se-wd-wp,
177
- var(--_ctm-tab-dn-he-pe-im-se-wd-wp, var(--_ctm-dn-he-pe-im-se-wd-wp, normal)));
178
- word-break: var(--_ctm-mob-dn-he-pe-im-se-wd-bk,
179
- var(--_ctm-tab-dn-he-pe-im-se-wd-bk, var(--_ctm-dn-he-pe-im-se-wd-bk, normal)));
180
- box-shadow: var(--_ctm-mob-dn-he-pe-im-se-sw-ae,
181
- var(--_ctm-tab-dn-he-pe-im-se-sw-ae, var(--_ctm-dn-he-pe-im-se-sw-ae))) var(--_ctm-mob-dn-he-pe-im-se-sw-br,
182
- var(--_ctm-tab-dn-he-pe-im-se-sw-br, var(--_ctm-dn-he-pe-im-se-sw-br))) var(--_ctm-mob-dn-he-pe-im-se-sw-sd,
183
- var(--_ctm-tab-dn-he-pe-im-se-sw-sd, var(--_ctm-dn-he-pe-im-se-sw-sd))) var(--_ctm-mob-dn-he-pe-im-se-sw-cr,
184
- var(--_ctm-tab-dn-he-pe-im-se-sw-cr, var(--_ctm-dn-he-pe-im-se-sw-cr)));
225
+ padding: var(
226
+ --_ctm-mob-dn-he-pe-im-se-pg,
227
+ var(--_ctm-tab-dn-he-pe-im-se-pg, var(--_ctm-dn-he-pe-im-se-pg))
228
+ );
229
+ gap: var(
230
+ --_ctm-mob-dn-he-pe-im-se-im-gp,
231
+ var(--_ctm-tab-dn-he-pe-im-se-im-gp, var(--_ctm-dn-he-pe-im-se-im-gp))
232
+ );
233
+ background-color: var(
234
+ --_ctm-mob-dn-he-pe-im-se-bd-cr,
235
+ var(--_ctm-tab-dn-he-pe-im-se-bd-cr, var(--_ctm-dn-he-pe-im-se-bd-cr))
236
+ );
237
+ border-color: var(
238
+ --_ctm-mob-dn-he-pe-im-se-br-cr,
239
+ var(--_ctm-tab-dn-he-pe-im-se-br-cr, var(--_ctm-dn-he-pe-im-se-br-cr))
240
+ );
241
+ border-radius: var(
242
+ --_ctm-mob-dn-he-pe-im-se-br-rs,
243
+ var(--_ctm-tab-dn-he-pe-im-se-br-rs, var(--_ctm-dn-he-pe-im-se-br-rs))
244
+ );
245
+ border-style: var(
246
+ --_ctm-mob-dn-he-pe-im-se-br-se,
247
+ var(--_ctm-tab-dn-he-pe-im-se-br-se, var(--_ctm-dn-he-pe-im-se-br-se))
248
+ );
249
+ border-width: var(
250
+ --_ctm-mob-dn-he-pe-im-se-br-wh,
251
+ var(--_ctm-tab-dn-he-pe-im-se-br-wh, var(--_ctm-dn-he-pe-im-se-br-wh))
252
+ );
253
+ color: var(
254
+ --_ctm-mob-dn-he-pe-im-se-cr,
255
+ var(--_ctm-tab-dn-he-pe-im-se-cr, var(--_ctm-dn-he-pe-im-se-cr))
256
+ );
257
+ font-family: var(
258
+ --_ctm-mob-dn-he-pe-im-se-ft-fy,
259
+ var(--_ctm-tab-dn-he-pe-im-se-ft-fy, var(--_ctm-dn-he-pe-im-se-ft-fy))
260
+ );
261
+ font-size: var(
262
+ --_ctm-mob-dn-he-pe-im-se-ft-se,
263
+ var(--_ctm-tab-dn-he-pe-im-se-ft-se, var(--_ctm-dn-he-pe-im-se-ft-se))
264
+ );
265
+ font-style: var(
266
+ --_ctm-mob-dn-he-pe-im-se-ft-se-ic,
267
+ var(--_ctm-tab-dn-he-pe-im-se-ft-se-ic, var(--_ctm-dn-he-pe-im-se-ft-se-ic))
268
+ );
269
+ font-weight: var(
270
+ --_ctm-mob-dn-he-pe-im-se-ft-wt,
271
+ var(--_ctm-tab-dn-he-pe-im-se-ft-wt, var(--_ctm-dn-he-pe-im-se-ft-wt))
272
+ );
273
+ line-height: var(
274
+ --_ctm-mob-dn-he-pe-im-se-le-ht,
275
+ var(--_ctm-tab-dn-he-pe-im-se-le-ht, var(--_ctm-dn-he-pe-im-se-le-ht))
276
+ );
277
+ letter-spacing: var(
278
+ --_ctm-mob-dn-he-pe-im-se-lr-sg,
279
+ var(--_ctm-tab-dn-he-pe-im-se-lr-sg, var(--_ctm-dn-he-pe-im-se-lr-sg))
280
+ );
281
+ text-align: var(
282
+ --_ctm-mob-dn-he-pe-im-se-tt-an,
283
+ var(--_ctm-tab-dn-he-pe-im-se-tt-an, var(--_ctm-dn-he-pe-im-se-tt-an))
284
+ );
285
+ text-decoration: var(
286
+ --_ctm-mob-dn-he-pe-im-se-ue,
287
+ var(--_ctm-tab-dn-he-pe-im-se-ue, var(--_ctm-dn-he-pe-im-se-ue))
288
+ );
289
+ text-transform: var(
290
+ --_ctm-mob-dn-he-pe-im-se-tt-tm,
291
+ var(--_ctm-tab-dn-he-pe-im-se-tt-tm, var(--_ctm-dn-he-pe-im-se-tt-tm, none))
292
+ );
293
+ word-wrap: var(
294
+ --_ctm-mob-dn-he-pe-im-se-wd-wp,
295
+ var(--_ctm-tab-dn-he-pe-im-se-wd-wp, var(--_ctm-dn-he-pe-im-se-wd-wp, normal))
296
+ );
297
+ word-break: var(
298
+ --_ctm-mob-dn-he-pe-im-se-wd-bk,
299
+ var(--_ctm-tab-dn-he-pe-im-se-wd-bk, var(--_ctm-dn-he-pe-im-se-wd-bk, normal))
300
+ );
301
+ box-shadow: var(
302
+ --_ctm-mob-dn-he-pe-im-se-sw-ae,
303
+ var(--_ctm-tab-dn-he-pe-im-se-sw-ae, var(--_ctm-dn-he-pe-im-se-sw-ae))
304
+ )
305
+ var(
306
+ --_ctm-mob-dn-he-pe-im-se-sw-br,
307
+ var(--_ctm-tab-dn-he-pe-im-se-sw-br, var(--_ctm-dn-he-pe-im-se-sw-br))
308
+ )
309
+ var(
310
+ --_ctm-mob-dn-he-pe-im-se-sw-sd,
311
+ var(--_ctm-tab-dn-he-pe-im-se-sw-sd, var(--_ctm-dn-he-pe-im-se-sw-sd))
312
+ )
313
+ var(
314
+ --_ctm-mob-dn-he-pe-im-se-sw-cr,
315
+ var(--_ctm-tab-dn-he-pe-im-se-sw-cr, var(--_ctm-dn-he-pe-im-se-sw-cr))
316
+ );
185
317
 
186
318
  .icon {
187
319
  svg {
188
- width: var(--_ctm-mob-dn-he-pe-im-se-in-se,
189
- var(--_ctm-tab-dn-he-pe-im-se-in-se, var(--_ctm-dn-he-pe-im-se-in-se)));
190
- height: var(--_ctm-mob-dn-he-pe-im-se-in-se,
191
- var(--_ctm-tab-dn-he-pe-im-se-in-se, var(--_ctm-dn-he-pe-im-se-in-se)));
192
-
320
+ width: var(
321
+ --_ctm-mob-dn-he-pe-im-se-in-se,
322
+ var(--_ctm-tab-dn-he-pe-im-se-in-se, var(--_ctm-dn-he-pe-im-se-in-se))
323
+ );
324
+ height: var(
325
+ --_ctm-mob-dn-he-pe-im-se-in-se,
326
+ var(--_ctm-tab-dn-he-pe-im-se-in-se, var(--_ctm-dn-he-pe-im-se-in-se))
327
+ );
193
328
  path {
194
- stroke: var(--_ctm-mob-dn-he-pe-im-se-in-c1,
195
- var(--_ctm-tab-dn-he-pe-im-se-in-c1, var(--_ctm-dn-he-pe-im-se-in-c1)));
329
+ stroke: var(
330
+ --_ctm-mob-dn-he-pe-im-se-in-c1,
331
+ var(--_ctm-tab-dn-he-pe-im-se-in-c1, var(--_ctm-dn-he-pe-im-se-in-c1))
332
+ );
196
333
  // Overrides the stroke-width presentation attribute baked into the icon markup.
197
334
  stroke-width: prepareMediaVariable(--_ctm-dn-he-pe-im-se-se-wh, 1.25);
198
335
  }
@@ -201,60 +338,114 @@ $resizeActive: '[data-cms-element-resizer="true"]';
201
338
  }
202
339
 
203
340
  &:last-of-type {
204
- padding: var(--_ctm-mob-dn-ct-pe-im-se-pg,
205
- var(--_ctm-tab-dn-ct-pe-im-se-pg, var(--_ctm-dn-ct-pe-im-se-pg)));
206
- gap: var(--_ctm-mob-dn-ct-pe-im-se-im-gp,
207
- var(--_ctm-tab-dn-ct-pe-im-se-im-gp, var(--_ctm-dn-ct-pe-im-se-im-gp)));
208
- background-color: var(--_ctm-mob-dn-ct-pe-im-se-bd-cr,
209
- var(--_ctm-tab-dn-ct-pe-im-se-bd-cr, var(--_ctm-dn-ct-pe-im-se-bd-cr)));
210
- border-color: var(--_ctm-mob-dn-ct-pe-im-se-br-cr,
211
- var(--_ctm-tab-dn-ct-pe-im-se-br-cr, var(--_ctm-dn-ct-pe-im-se-br-cr)));
212
- border-radius: var(--_ctm-mob-dn-ct-pe-im-se-br-rs,
213
- var(--_ctm-tab-dn-ct-pe-im-se-br-rs, var(--_ctm-dn-ct-pe-im-se-br-rs)));
214
- border-style: var(--_ctm-mob-dn-ct-pe-im-se-br-se,
215
- var(--_ctm-tab-dn-ct-pe-im-se-br-se, var(--_ctm-dn-ct-pe-im-se-br-se)));
216
- border-width: var(--_ctm-mob-dn-ct-pe-im-se-br-wh,
217
- var(--_ctm-tab-dn-ct-pe-im-se-br-wh, var(--_ctm-dn-ct-pe-im-se-br-wh)));
218
- color: var(--_ctm-mob-dn-ct-pe-im-se-cr,
219
- var(--_ctm-tab-dn-ct-pe-im-se-cr, var(--_ctm-dn-ct-pe-im-se-cr)));
220
- font-family: var(--_ctm-mob-dn-ct-pe-im-se-ft-fy,
221
- var(--_ctm-tab-dn-ct-pe-im-se-ft-fy, var(--_ctm-dn-ct-pe-im-se-ft-fy)));
222
- font-size: var(--_ctm-mob-dn-ct-pe-im-se-ft-se,
223
- var(--_ctm-tab-dn-ct-pe-im-se-ft-se, var(--_ctm-dn-ct-pe-im-se-ft-se)));
224
- font-style: var(--_ctm-mob-dn-ct-pe-im-se-ft-se-ic,
225
- var(--_ctm-tab-dn-ct-pe-im-se-ft-se-ic, var(--_ctm-dn-ct-pe-im-se-ft-se-ic)));
226
- font-weight: var(--_ctm-mob-dn-ct-pe-im-se-ft-wt,
227
- var(--_ctm-tab-dn-ct-pe-im-se-ft-wt, var(--_ctm-dn-ct-pe-im-se-ft-wt)));
228
- line-height: var(--_ctm-mob-dn-ct-pe-im-se-le-ht,
229
- var(--_ctm-tab-dn-ct-pe-im-se-le-ht, var(--_ctm-dn-ct-pe-im-se-le-ht)));
230
- letter-spacing: var(--_ctm-mob-dn-ct-pe-im-se-lr-sg,
231
- var(--_ctm-tab-dn-ct-pe-im-se-lr-sg, var(--_ctm-dn-ct-pe-im-se-lr-sg)));
232
- text-align: var(--_ctm-mob-dn-ct-pe-im-se-tt-an,
233
- var(--_ctm-tab-dn-ct-pe-im-se-tt-an, var(--_ctm-dn-ct-pe-im-se-tt-an)));
234
- text-decoration: var(--_ctm-mob-dn-ct-pe-im-se-ue,
235
- var(--_ctm-tab-dn-ct-pe-im-se-ue, var(--_ctm-dn-ct-pe-im-se-ue)));
236
- text-transform: var(--_ctm-mob-dn-ct-pe-im-se-tt-tm,
237
- var(--_ctm-tab-dn-ct-pe-im-se-tt-tm, var(--_ctm-dn-ct-pe-im-se-tt-tm, none)));
238
- word-wrap: var(--_ctm-mob-dn-ct-pe-im-se-wd-wp,
239
- var(--_ctm-tab-dn-ct-pe-im-se-wd-wp, var(--_ctm-dn-ct-pe-im-se-wd-wp, normal)));
240
- word-break: var(--_ctm-mob-dn-ct-pe-im-se-wd-bk,
241
- var(--_ctm-tab-dn-ct-pe-im-se-wd-bk, var(--_ctm-dn-ct-pe-im-se-wd-bk, normal)));
242
- box-shadow: var(--_ctm-mob-dn-ct-pe-im-se-sw-ae,
243
- var(--_ctm-tab-dn-ct-pe-im-se-sw-ae, var(--_ctm-dn-ct-pe-im-se-sw-ae))) var(--_ctm-mob-dn-ct-pe-im-se-sw-sd,
244
- var(--_ctm-tab-dn-ct-pe-im-se-sw-sd, var(--_ctm-dn-ct-pe-im-se-sw-sd))) var(--_ctm-mob-dn-he-pe-im-se-sw-sd,
245
- var(--_ctm-tab-dn-he-pe-im-se-sw-sd, var(--_ctm-dn-he-pe-im-se-sw-sd))) var(--_ctm-mob-dn-ct-pe-im-se-sw-cr,
246
- var(--_ctm-tab-dn-ct-pe-im-se-sw-cr, var(--_ctm-dn-ct-pe-im-se-sw-cr)));
341
+ padding: var(
342
+ --_ctm-mob-dn-ct-pe-im-se-pg,
343
+ var(--_ctm-tab-dn-ct-pe-im-se-pg, var(--_ctm-dn-ct-pe-im-se-pg))
344
+ );
345
+ gap: var(
346
+ --_ctm-mob-dn-ct-pe-im-se-im-gp,
347
+ var(--_ctm-tab-dn-ct-pe-im-se-im-gp, var(--_ctm-dn-ct-pe-im-se-im-gp))
348
+ );
349
+ background-color: var(
350
+ --_ctm-mob-dn-ct-pe-im-se-bd-cr,
351
+ var(--_ctm-tab-dn-ct-pe-im-se-bd-cr, var(--_ctm-dn-ct-pe-im-se-bd-cr))
352
+ );
353
+ border-color: var(
354
+ --_ctm-mob-dn-ct-pe-im-se-br-cr,
355
+ var(--_ctm-tab-dn-ct-pe-im-se-br-cr, var(--_ctm-dn-ct-pe-im-se-br-cr))
356
+ );
357
+ border-radius: var(
358
+ --_ctm-mob-dn-ct-pe-im-se-br-rs,
359
+ var(--_ctm-tab-dn-ct-pe-im-se-br-rs, var(--_ctm-dn-ct-pe-im-se-br-rs))
360
+ );
361
+ border-style: var(
362
+ --_ctm-mob-dn-ct-pe-im-se-br-se,
363
+ var(--_ctm-tab-dn-ct-pe-im-se-br-se, var(--_ctm-dn-ct-pe-im-se-br-se))
364
+ );
365
+ border-width: var(
366
+ --_ctm-mob-dn-ct-pe-im-se-br-wh,
367
+ var(--_ctm-tab-dn-ct-pe-im-se-br-wh, var(--_ctm-dn-ct-pe-im-se-br-wh))
368
+ );
369
+ color: var(
370
+ --_ctm-mob-dn-ct-pe-im-se-cr,
371
+ var(--_ctm-tab-dn-ct-pe-im-se-cr, var(--_ctm-dn-ct-pe-im-se-cr))
372
+ );
373
+ font-family: var(
374
+ --_ctm-mob-dn-ct-pe-im-se-ft-fy,
375
+ var(--_ctm-tab-dn-ct-pe-im-se-ft-fy, var(--_ctm-dn-ct-pe-im-se-ft-fy))
376
+ );
377
+ font-size: var(
378
+ --_ctm-mob-dn-ct-pe-im-se-ft-se,
379
+ var(--_ctm-tab-dn-ct-pe-im-se-ft-se, var(--_ctm-dn-ct-pe-im-se-ft-se))
380
+ );
381
+ font-style: var(
382
+ --_ctm-mob-dn-ct-pe-im-se-ft-se-ic,
383
+ var(--_ctm-tab-dn-ct-pe-im-se-ft-se-ic, var(--_ctm-dn-ct-pe-im-se-ft-se-ic))
384
+ );
385
+ font-weight: var(
386
+ --_ctm-mob-dn-ct-pe-im-se-ft-wt,
387
+ var(--_ctm-tab-dn-ct-pe-im-se-ft-wt, var(--_ctm-dn-ct-pe-im-se-ft-wt))
388
+ );
389
+ line-height: var(
390
+ --_ctm-mob-dn-ct-pe-im-se-le-ht,
391
+ var(--_ctm-tab-dn-ct-pe-im-se-le-ht, var(--_ctm-dn-ct-pe-im-se-le-ht))
392
+ );
393
+ letter-spacing: var(
394
+ --_ctm-mob-dn-ct-pe-im-se-lr-sg,
395
+ var(--_ctm-tab-dn-ct-pe-im-se-lr-sg, var(--_ctm-dn-ct-pe-im-se-lr-sg))
396
+ );
397
+ text-align: var(
398
+ --_ctm-mob-dn-ct-pe-im-se-tt-an,
399
+ var(--_ctm-tab-dn-ct-pe-im-se-tt-an, var(--_ctm-dn-ct-pe-im-se-tt-an))
400
+ );
401
+ text-decoration: var(
402
+ --_ctm-mob-dn-ct-pe-im-se-ue,
403
+ var(--_ctm-tab-dn-ct-pe-im-se-ue, var(--_ctm-dn-ct-pe-im-se-ue))
404
+ );
405
+ text-transform: var(
406
+ --_ctm-mob-dn-ct-pe-im-se-tt-tm,
407
+ var(--_ctm-tab-dn-ct-pe-im-se-tt-tm, var(--_ctm-dn-ct-pe-im-se-tt-tm, none))
408
+ );
409
+ word-wrap: var(
410
+ --_ctm-mob-dn-ct-pe-im-se-wd-wp,
411
+ var(--_ctm-tab-dn-ct-pe-im-se-wd-wp, var(--_ctm-dn-ct-pe-im-se-wd-wp, normal))
412
+ );
413
+ word-break: var(
414
+ --_ctm-mob-dn-ct-pe-im-se-wd-bk,
415
+ var(--_ctm-tab-dn-ct-pe-im-se-wd-bk, var(--_ctm-dn-ct-pe-im-se-wd-bk, normal))
416
+ );
417
+ box-shadow: var(
418
+ --_ctm-mob-dn-ct-pe-im-se-sw-ae,
419
+ var(--_ctm-tab-dn-ct-pe-im-se-sw-ae, var(--_ctm-dn-ct-pe-im-se-sw-ae))
420
+ )
421
+ var(
422
+ --_ctm-mob-dn-ct-pe-im-se-sw-sd,
423
+ var(--_ctm-tab-dn-ct-pe-im-se-sw-sd, var(--_ctm-dn-ct-pe-im-se-sw-sd))
424
+ )
425
+ var(
426
+ --_ctm-mob-dn-he-pe-im-se-sw-sd,
427
+ var(--_ctm-tab-dn-he-pe-im-se-sw-sd, var(--_ctm-dn-he-pe-im-se-sw-sd))
428
+ )
429
+ var(
430
+ --_ctm-mob-dn-ct-pe-im-se-sw-cr,
431
+ var(--_ctm-tab-dn-ct-pe-im-se-sw-cr, var(--_ctm-dn-ct-pe-im-se-sw-cr))
432
+ );
247
433
 
248
434
  .icon {
249
435
  svg {
250
- width: var(--_ctm-mob-dn-ct-pe-im-se-in-se,
251
- var(--_ctm-tab-dn-ct-pe-im-se-in-se, var(--_ctm-dn-ct-pe-im-se-in-se)));
252
- height: var(--_ctm-mob-dn-ct-pe-im-se-in-se,
253
- var(--_ctm-tab-dn-ct-pe-im-se-in-se, var(--_ctm-dn-ct-pe-im-se-in-se)));
254
-
436
+ width: var(
437
+ --_ctm-mob-dn-ct-pe-im-se-in-se,
438
+ var(--_ctm-tab-dn-ct-pe-im-se-in-se, var(--_ctm-dn-ct-pe-im-se-in-se))
439
+ );
440
+ height: var(
441
+ --_ctm-mob-dn-ct-pe-im-se-in-se,
442
+ var(--_ctm-tab-dn-ct-pe-im-se-in-se, var(--_ctm-dn-ct-pe-im-se-in-se))
443
+ );
255
444
  path {
256
- stroke: var(--_ctm-mob-dn-ct-pe-im-se-in-c1,
257
- var(--_ctm-tab-dn-ct-pe-im-se-in-c1, var(--_ctm-dn-ct-pe-im-se-in-c1)));
445
+ stroke: var(
446
+ --_ctm-mob-dn-ct-pe-im-se-in-c1,
447
+ var(--_ctm-tab-dn-ct-pe-im-se-in-c1, var(--_ctm-dn-ct-pe-im-se-in-c1))
448
+ );
258
449
  // Overrides the stroke-width presentation attribute baked into the icon markup.
259
450
  stroke-width: prepareMediaVariable(--_ctm-dn-ct-pe-im-se-se-wh, 1.25);
260
451
  }
@@ -263,7 +454,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
263
454
  }
264
455
  }
265
456
  }
266
-
267
457
  .vertical_breadcrumb_wrapper {
268
458
  display: flex;
269
459
  align-items: flex-start;
@@ -274,8 +464,10 @@ $resizeActive: '[data-cms-element-resizer="true"]';
274
464
  // which encloses both the horizontal and the vertical trail. They used to be
275
465
  // repeated here as well, so the vertical layout drew the section's border and
276
466
  // shadow twice — once around the whole widget and again around the inner list.
277
- background-color: var(--_ctm-mob-dn-bd-ad-fl-bd-cr,
278
- var(--_ctm-tab-dn-bd-ad-fl-bd-cr, var(--_ctm-dn-bd-ad-fl-bd-cr)));
467
+ background-color: var(
468
+ --_ctm-mob-dn-bd-ad-fl-bd-cr,
469
+ var(--_ctm-tab-dn-bd-ad-fl-bd-cr, var(--_ctm-dn-bd-ad-fl-bd-cr))
470
+ );
279
471
  padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
280
472
 
281
473
  &[overflow-item="Scroll"],
@@ -287,8 +479,10 @@ $resizeActive: '[data-cms-element-resizer="true"]';
287
479
 
288
480
  &[overflow-item="Wrap"] {
289
481
  flex-wrap: wrap;
290
- row-gap: var(--_ctm-mob-lt-im-vl-sg,
291
- var(--_ctm-tab-lt-im-vl-sg, var(--_ctm-lt-im-vl-sg)));
482
+ row-gap: var(
483
+ --_ctm-mob-lt-im-vl-sg,
484
+ var(--_ctm-tab-lt-im-vl-sg, var(--_ctm-lt-im-vl-sg))
485
+ );
292
486
  column-gap: var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg)));
293
487
  }
294
488
 
@@ -304,62 +498,110 @@ $resizeActive: '[data-cms-element-resizer="true"]';
304
498
  white-space: nowrap;
305
499
  align-items: center;
306
500
 
307
- background-color: var(--_ctm-mob-dn-he-pe-im-se-bd-cr,
308
- var(--_ctm-tab-dn-he-pe-im-se-bd-cr, var(--_ctm-dn-he-pe-im-se-bd-cr)));
309
- border-color: var(--_ctm-mob-dn-he-pe-im-se-br-cr,
310
- var(--_ctm-tab-dn-he-pe-im-se-br-cr, var(--_ctm-dn-he-pe-im-se-br-cr)));
311
- border-radius: var(--_ctm-mob-dn-he-pe-im-se-br-rs,
312
- var(--_ctm-tab-dn-he-pe-im-se-br-rs, var(--_ctm-dn-he-pe-im-se-br-rs)));
313
- border-style: var(--_ctm-mob-dn-he-pe-im-se-br-se,
314
- var(--_ctm-tab-dn-he-pe-im-se-br-se, var(--_ctm-dn-he-pe-im-se-br-se)));
315
- border-width: var(--_ctm-mob-dn-he-pe-im-se-br-wh,
316
- var(--_ctm-tab-dn-he-pe-im-se-br-wh, var(--_ctm-dn-he-pe-im-se-br-wh)));
317
- color: var(--_ctm-mob-dn-he-pe-im-se-cr,
318
- var(--_ctm-tab-dn-he-pe-im-se-cr, var(--_ctm-dn-he-pe-im-se-cr)));
319
- font-family: var(--_ctm-mob-dn-he-pe-im-se-ft-fy,
320
- var(--_ctm-tab-dn-he-pe-im-se-ft-fy, var(--_ctm-dn-he-pe-im-se-ft-fy)));
321
-
501
+ background-color: var(
502
+ --_ctm-mob-dn-he-pe-im-se-bd-cr,
503
+ var(--_ctm-tab-dn-he-pe-im-se-bd-cr, var(--_ctm-dn-he-pe-im-se-bd-cr))
504
+ );
505
+ border-color: var(
506
+ --_ctm-mob-dn-he-pe-im-se-br-cr,
507
+ var(--_ctm-tab-dn-he-pe-im-se-br-cr, var(--_ctm-dn-he-pe-im-se-br-cr))
508
+ );
509
+ border-radius: var(
510
+ --_ctm-mob-dn-he-pe-im-se-br-rs,
511
+ var(--_ctm-tab-dn-he-pe-im-se-br-rs, var(--_ctm-dn-he-pe-im-se-br-rs))
512
+ );
513
+ border-style: var(
514
+ --_ctm-mob-dn-he-pe-im-se-br-se,
515
+ var(--_ctm-tab-dn-he-pe-im-se-br-se, var(--_ctm-dn-he-pe-im-se-br-se))
516
+ );
517
+ border-width: var(
518
+ --_ctm-mob-dn-he-pe-im-se-br-wh,
519
+ var(--_ctm-tab-dn-he-pe-im-se-br-wh, var(--_ctm-dn-he-pe-im-se-br-wh))
520
+ );
521
+ color: var(
522
+ --_ctm-mob-dn-he-pe-im-se-cr,
523
+ var(--_ctm-tab-dn-he-pe-im-se-cr, var(--_ctm-dn-he-pe-im-se-cr))
524
+ );
525
+ font-family: var(
526
+ --_ctm-mob-dn-he-pe-im-se-ft-fy,
527
+ var(--_ctm-tab-dn-he-pe-im-se-ft-fy, var(--_ctm-dn-he-pe-im-se-ft-fy))
528
+ );
322
529
  &.flex__overflow {
323
530
  white-space: normal;
324
531
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
325
532
  }
326
-
327
- font-size: var(--_ctm-mob-dn-he-pe-im-se-ft-se,
328
- var(--_ctm-tab-dn-he-pe-im-se-ft-se, var(--_ctm-dn-he-pe-im-se-ft-se)));
329
- font-style: var(--_ctm-mob-dn-he-pe-im-se-ft-se-ic,
330
- var(--_ctm-tab-dn-he-pe-im-se-ft-se-ic, var(--_ctm-dn-he-pe-im-se-ft-se-ic)));
331
- font-weight: var(--_ctm-mob-dn-he-pe-im-se-ft-wt,
332
- var(--_ctm-tab-dn-he-pe-im-se-ft-wt, var(--_ctm-dn-he-pe-im-se-ft-wt)));
333
- line-height: var(--_ctm-mob-dn-he-pe-im-se-le-ht,
334
- var(--_ctm-tab-dn-he-pe-im-se-le-ht, var(--_ctm-dn-he-pe-im-se-le-ht)));
335
- letter-spacing: var(--_ctm-mob-dn-he-pe-im-se-lr-sg,
336
- var(--_ctm-tab-dn-he-pe-im-se-lr-sg, var(--_ctm-dn-he-pe-im-se-lr-sg)));
337
- text-align: var(--_ctm-mob-dn-he-pe-im-se-tt-an,
338
- var(--_ctm-tab-dn-he-pe-im-se-tt-an, var(--_ctm-dn-he-pe-im-se-tt-an)));
339
- text-decoration: var(--_ctm-mob-dn-he-pe-im-se-ue,
340
- var(--_ctm-tab-dn-he-pe-im-se-ue, var(--_ctm-dn-he-pe-im-se-ue)));
341
- text-transform: var(--_ctm-mob-dn-he-pe-im-se-tt-tm,
342
- var(--_ctm-tab-dn-he-pe-im-se-tt-tm, var(--_ctm-dn-he-pe-im-se-tt-tm, none)));
343
- word-wrap: var(--_ctm-mob-dn-he-pe-im-se-wd-wp,
344
- var(--_ctm-tab-dn-he-pe-im-se-wd-wp, var(--_ctm-dn-he-pe-im-se-wd-wp, normal)));
345
- word-break: var(--_ctm-mob-dn-he-pe-im-se-wd-bk,
346
- var(--_ctm-tab-dn-he-pe-im-se-wd-bk, var(--_ctm-dn-he-pe-im-se-wd-bk, normal)));
347
- box-shadow: var(--_ctm-mob-dn-he-pe-im-se-sw-ae,
348
- var(--_ctm-tab-dn-he-pe-im-se-sw-ae, var(--_ctm-dn-he-pe-im-se-sw-ae))) var(--_ctm-mob-dn-he-pe-im-se-sw-br,
349
- var(--_ctm-tab-dn-he-pe-im-se-sw-br, var(--_ctm-dn-he-pe-im-se-sw-br))) var(--_ctm-mob-dn-he-pe-im-se-sw-sd,
350
- var(--_ctm-tab-dn-he-pe-im-se-sw-sd, var(--_ctm-dn-he-pe-im-se-sw-sd))) var(--_ctm-mob-dn-he-pe-im-se-sw-cr,
351
- var(--_ctm-tab-dn-he-pe-im-se-sw-cr, var(--_ctm-dn-he-pe-im-se-sw-cr)));
533
+ font-size: var(
534
+ --_ctm-mob-dn-he-pe-im-se-ft-se,
535
+ var(--_ctm-tab-dn-he-pe-im-se-ft-se, var(--_ctm-dn-he-pe-im-se-ft-se))
536
+ );
537
+ font-style: var(
538
+ --_ctm-mob-dn-he-pe-im-se-ft-se-ic,
539
+ var(--_ctm-tab-dn-he-pe-im-se-ft-se-ic, var(--_ctm-dn-he-pe-im-se-ft-se-ic))
540
+ );
541
+ font-weight: var(
542
+ --_ctm-mob-dn-he-pe-im-se-ft-wt,
543
+ var(--_ctm-tab-dn-he-pe-im-se-ft-wt, var(--_ctm-dn-he-pe-im-se-ft-wt))
544
+ );
545
+ line-height: var(
546
+ --_ctm-mob-dn-he-pe-im-se-le-ht,
547
+ var(--_ctm-tab-dn-he-pe-im-se-le-ht, var(--_ctm-dn-he-pe-im-se-le-ht))
548
+ );
549
+ letter-spacing: var(
550
+ --_ctm-mob-dn-he-pe-im-se-lr-sg,
551
+ var(--_ctm-tab-dn-he-pe-im-se-lr-sg, var(--_ctm-dn-he-pe-im-se-lr-sg))
552
+ );
553
+ text-align: var(
554
+ --_ctm-mob-dn-he-pe-im-se-tt-an,
555
+ var(--_ctm-tab-dn-he-pe-im-se-tt-an, var(--_ctm-dn-he-pe-im-se-tt-an))
556
+ );
557
+ text-decoration: var(
558
+ --_ctm-mob-dn-he-pe-im-se-ue,
559
+ var(--_ctm-tab-dn-he-pe-im-se-ue, var(--_ctm-dn-he-pe-im-se-ue))
560
+ );
561
+ text-transform: var(
562
+ --_ctm-mob-dn-he-pe-im-se-tt-tm,
563
+ var(--_ctm-tab-dn-he-pe-im-se-tt-tm, var(--_ctm-dn-he-pe-im-se-tt-tm, none))
564
+ );
565
+ word-wrap: var(
566
+ --_ctm-mob-dn-he-pe-im-se-wd-wp,
567
+ var(--_ctm-tab-dn-he-pe-im-se-wd-wp, var(--_ctm-dn-he-pe-im-se-wd-wp, normal))
568
+ );
569
+ word-break: var(
570
+ --_ctm-mob-dn-he-pe-im-se-wd-bk,
571
+ var(--_ctm-tab-dn-he-pe-im-se-wd-bk, var(--_ctm-dn-he-pe-im-se-wd-bk, normal))
572
+ );
573
+ box-shadow: var(
574
+ --_ctm-mob-dn-he-pe-im-se-sw-ae,
575
+ var(--_ctm-tab-dn-he-pe-im-se-sw-ae, var(--_ctm-dn-he-pe-im-se-sw-ae))
576
+ )
577
+ var(
578
+ --_ctm-mob-dn-he-pe-im-se-sw-br,
579
+ var(--_ctm-tab-dn-he-pe-im-se-sw-br, var(--_ctm-dn-he-pe-im-se-sw-br))
580
+ )
581
+ var(
582
+ --_ctm-mob-dn-he-pe-im-se-sw-sd,
583
+ var(--_ctm-tab-dn-he-pe-im-se-sw-sd, var(--_ctm-dn-he-pe-im-se-sw-sd))
584
+ )
585
+ var(
586
+ --_ctm-mob-dn-he-pe-im-se-sw-cr,
587
+ var(--_ctm-tab-dn-he-pe-im-se-sw-cr, var(--_ctm-dn-he-pe-im-se-sw-cr))
588
+ );
352
589
 
353
590
  .icon {
354
591
  svg {
355
- width: var(--_ctm-mob-dn-he-pe-im-se-in-se,
356
- var(--_ctm-tab-dn-he-pe-im-se-in-se, var(--_ctm-dn-he-pe-im-se-in-se)));
357
- height: var(--_ctm-mob-dn-he-pe-im-se-in-se,
358
- var(--_ctm-tab-dn-he-pe-im-se-in-se, var(--_ctm-dn-he-pe-im-se-in-se)));
359
-
592
+ width: var(
593
+ --_ctm-mob-dn-he-pe-im-se-in-se,
594
+ var(--_ctm-tab-dn-he-pe-im-se-in-se, var(--_ctm-dn-he-pe-im-se-in-se))
595
+ );
596
+ height: var(
597
+ --_ctm-mob-dn-he-pe-im-se-in-se,
598
+ var(--_ctm-tab-dn-he-pe-im-se-in-se, var(--_ctm-dn-he-pe-im-se-in-se))
599
+ );
360
600
  path {
361
- stroke: var(--_ctm-mob-dn-he-pe-im-se-in-c1,
362
- var(--_ctm-tab-dn-he-pe-im-se-in-c1, var(--_ctm-dn-he-pe-im-se-in-c1)));
601
+ stroke: var(
602
+ --_ctm-mob-dn-he-pe-im-se-in-c1,
603
+ var(--_ctm-tab-dn-he-pe-im-se-in-c1, var(--_ctm-dn-he-pe-im-se-in-c1))
604
+ );
363
605
  // Overrides the stroke-width presentation attribute baked into the icon markup.
364
606
  stroke-width: prepareMediaVariable(--_ctm-dn-he-pe-im-se-se-wh, 1.25);
365
607
  }
@@ -375,62 +617,110 @@ $resizeActive: '[data-cms-element-resizer="true"]';
375
617
  white-space: nowrap;
376
618
  align-items: center;
377
619
 
378
- background-color: var(--_ctm-mob-dn-or-im-se-bd-cr,
379
- var(--_ctm-tab-dn-or-im-se-bd-cr, var(--_ctm-dn-or-im-se-bd-cr)));
380
- border-color: var(--_ctm-mob-dn-or-im-se-br-cr,
381
- var(--_ctm-tab-dn-or-im-se-br-cr, var(--_ctm-dn-or-im-se-br-cr)));
382
- border-radius: var(--_ctm-mob-dn-or-im-se-br-rs,
383
- var(--_ctm-tab-dn-or-im-se-br-rs, var(--_ctm-dn-or-im-se-br-rs)));
384
- border-style: var(--_ctm-mob-dn-or-im-se-br-se,
385
- var(--_ctm-tab-dn-or-im-se-br-se, var(--_ctm-dn-or-im-se-br-se)));
386
- border-width: var(--_ctm-mob-dn-or-im-se-br-wh,
387
- var(--_ctm-tab-dn-or-im-se-br-wh, var(--_ctm-dn-or-im-se-br-wh)));
388
- color: var(--_ctm-mob-dn-or-im-se-cr,
389
- var(--_ctm-tab-dn-or-im-se-cr, var(--_ctm-dn-or-im-se-cr)));
390
- font-family: var(--_ctm-mob-dn-or-im-se-ft-fy,
391
- var(--_ctm-tab-dn-or-im-se-ft-fy, var(--_ctm-dn-or-im-se-ft-fy)));
392
-
620
+ background-color: var(
621
+ --_ctm-mob-dn-or-im-se-bd-cr,
622
+ var(--_ctm-tab-dn-or-im-se-bd-cr, var(--_ctm-dn-or-im-se-bd-cr))
623
+ );
624
+ border-color: var(
625
+ --_ctm-mob-dn-or-im-se-br-cr,
626
+ var(--_ctm-tab-dn-or-im-se-br-cr, var(--_ctm-dn-or-im-se-br-cr))
627
+ );
628
+ border-radius: var(
629
+ --_ctm-mob-dn-or-im-se-br-rs,
630
+ var(--_ctm-tab-dn-or-im-se-br-rs, var(--_ctm-dn-or-im-se-br-rs))
631
+ );
632
+ border-style: var(
633
+ --_ctm-mob-dn-or-im-se-br-se,
634
+ var(--_ctm-tab-dn-or-im-se-br-se, var(--_ctm-dn-or-im-se-br-se))
635
+ );
636
+ border-width: var(
637
+ --_ctm-mob-dn-or-im-se-br-wh,
638
+ var(--_ctm-tab-dn-or-im-se-br-wh, var(--_ctm-dn-or-im-se-br-wh))
639
+ );
640
+ color: var(
641
+ --_ctm-mob-dn-or-im-se-cr,
642
+ var(--_ctm-tab-dn-or-im-se-cr, var(--_ctm-dn-or-im-se-cr))
643
+ );
644
+ font-family: var(
645
+ --_ctm-mob-dn-or-im-se-ft-fy,
646
+ var(--_ctm-tab-dn-or-im-se-ft-fy, var(--_ctm-dn-or-im-se-ft-fy))
647
+ );
393
648
  &.flex__overflow {
394
649
  white-space: normal;
395
650
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
396
651
  }
397
-
398
- font-size: var(--_ctm-mob-dn-or-im-se-ft-se,
399
- var(--_ctm-tab-dn-or-im-se-ft-se, var(--_ctm-dn-or-im-se-ft-se)));
400
- font-style: var(--_ctm-mob-dn-or-im-se-ft-se-ic,
401
- var(--_ctm-tab-dn-or-im-se-ft-se-ic, var(--_ctm-dn-or-im-se-ft-se-ic)));
402
- font-weight: var(--_ctm-mob-dn-or-im-se-ft-wt,
403
- var(--_ctm-tab-dn-or-im-se-ft-wt, var(--_ctm-dn-or-im-se-ft-wt)));
404
- line-height: var(--_ctm-mob-dn-or-im-se-le-ht,
405
- var(--_ctm-tab-dn-or-im-se-le-ht, var(--_ctm-dn-or-im-se-le-ht)));
406
- letter-spacing: var(--_ctm-mob-dn-or-im-se-lr-sg,
407
- var(--_ctm-tab-dn-or-im-se-lr-sg, var(--_ctm-dn-or-im-se-lr-sg)));
408
- text-align: var(--_ctm-mob-dn-or-im-se-tt-an,
409
- var(--_ctm-tab-dn-or-im-se-tt-an, var(--_ctm-dn-or-im-se-tt-an)));
410
- text-decoration: var(--_ctm-mob-dn-or-im-se-ue,
411
- var(--_ctm-tab-dn-or-im-se-ue, var(--_ctm-dn-or-im-se-ue)));
412
- text-transform: var(--_ctm-mob-dn-or-im-se-tt-tm,
413
- var(--_ctm-tab-dn-or-im-se-tt-tm, var(--_ctm-dn-or-im-se-tt-tm, none)));
414
- word-wrap: var(--_ctm-mob-dn-or-im-se-wd-wp,
415
- var(--_ctm-tab-dn-or-im-se-wd-wp, var(--_ctm-dn-or-im-se-wd-wp, normal)));
416
- word-break: var(--_ctm-mob-dn-or-im-se-wd-bk,
417
- var(--_ctm-tab-dn-or-im-se-wd-bk, var(--_ctm-dn-or-im-se-wd-bk, normal)));
418
- box-shadow: var(--_ctm-mob-dn-or-im-se-sw-ae,
419
- var(--_ctm-tab-dn-or-im-se-sw-ae, var(--_ctm-dn-or-im-se-sw-ae))) var(--_ctm-mob-dn-or-im-se-sw-br,
420
- var(--_ctm-tab-dn-or-im-se-sw-br, var(--_ctm-dn-or-im-se-sw-br))) var(--_ctm-mob-dn-or-im-se-sw-sd,
421
- var(--_ctm-tab-dn-or-im-se-sw-sd, var(--_ctm-dn-or-im-se-sw-sd))) var(--_ctm-mob-dn-or-im-se-sw-cr,
422
- var(--_ctm-tab-dn-or-im-se-sw-cr, var(--_ctm-dn-or-im-se-sw-cr)));
652
+ font-size: var(
653
+ --_ctm-mob-dn-or-im-se-ft-se,
654
+ var(--_ctm-tab-dn-or-im-se-ft-se, var(--_ctm-dn-or-im-se-ft-se))
655
+ );
656
+ font-style: var(
657
+ --_ctm-mob-dn-or-im-se-ft-se-ic,
658
+ var(--_ctm-tab-dn-or-im-se-ft-se-ic, var(--_ctm-dn-or-im-se-ft-se-ic))
659
+ );
660
+ font-weight: var(
661
+ --_ctm-mob-dn-or-im-se-ft-wt,
662
+ var(--_ctm-tab-dn-or-im-se-ft-wt, var(--_ctm-dn-or-im-se-ft-wt))
663
+ );
664
+ line-height: var(
665
+ --_ctm-mob-dn-or-im-se-le-ht,
666
+ var(--_ctm-tab-dn-or-im-se-le-ht, var(--_ctm-dn-or-im-se-le-ht))
667
+ );
668
+ letter-spacing: var(
669
+ --_ctm-mob-dn-or-im-se-lr-sg,
670
+ var(--_ctm-tab-dn-or-im-se-lr-sg, var(--_ctm-dn-or-im-se-lr-sg))
671
+ );
672
+ text-align: var(
673
+ --_ctm-mob-dn-or-im-se-tt-an,
674
+ var(--_ctm-tab-dn-or-im-se-tt-an, var(--_ctm-dn-or-im-se-tt-an))
675
+ );
676
+ text-decoration: var(
677
+ --_ctm-mob-dn-or-im-se-ue,
678
+ var(--_ctm-tab-dn-or-im-se-ue, var(--_ctm-dn-or-im-se-ue))
679
+ );
680
+ text-transform: var(
681
+ --_ctm-mob-dn-or-im-se-tt-tm,
682
+ var(--_ctm-tab-dn-or-im-se-tt-tm, var(--_ctm-dn-or-im-se-tt-tm, none))
683
+ );
684
+ word-wrap: var(
685
+ --_ctm-mob-dn-or-im-se-wd-wp,
686
+ var(--_ctm-tab-dn-or-im-se-wd-wp, var(--_ctm-dn-or-im-se-wd-wp, normal))
687
+ );
688
+ word-break: var(
689
+ --_ctm-mob-dn-or-im-se-wd-bk,
690
+ var(--_ctm-tab-dn-or-im-se-wd-bk, var(--_ctm-dn-or-im-se-wd-bk, normal))
691
+ );
692
+ box-shadow: var(
693
+ --_ctm-mob-dn-or-im-se-sw-ae,
694
+ var(--_ctm-tab-dn-or-im-se-sw-ae, var(--_ctm-dn-or-im-se-sw-ae))
695
+ )
696
+ var(
697
+ --_ctm-mob-dn-or-im-se-sw-br,
698
+ var(--_ctm-tab-dn-or-im-se-sw-br, var(--_ctm-dn-or-im-se-sw-br))
699
+ )
700
+ var(
701
+ --_ctm-mob-dn-or-im-se-sw-sd,
702
+ var(--_ctm-tab-dn-or-im-se-sw-sd, var(--_ctm-dn-or-im-se-sw-sd))
703
+ )
704
+ var(
705
+ --_ctm-mob-dn-or-im-se-sw-cr,
706
+ var(--_ctm-tab-dn-or-im-se-sw-cr, var(--_ctm-dn-or-im-se-sw-cr))
707
+ );
423
708
 
424
709
  .icon {
425
710
  svg {
426
- width: var(--_ctm-mob-dn-or-im-se-in-se,
427
- var(--_ctm-tab-dn-or-im-se-in-se, var(--_ctm-dn-or-im-se-in-se)));
428
- height: var(--_ctm-mob-dn-or-im-se-in-se,
429
- var(--_ctm-tab-dn-or-im-se-in-se, var(--_ctm-dn-or-im-se-in-se)));
430
-
711
+ width: var(
712
+ --_ctm-mob-dn-or-im-se-in-se,
713
+ var(--_ctm-tab-dn-or-im-se-in-se, var(--_ctm-dn-or-im-se-in-se))
714
+ );
715
+ height: var(
716
+ --_ctm-mob-dn-or-im-se-in-se,
717
+ var(--_ctm-tab-dn-or-im-se-in-se, var(--_ctm-dn-or-im-se-in-se))
718
+ );
431
719
  path {
432
- stroke: var(--_ctm-mob-dn-or-im-se-in-c1,
433
- var(--_ctm-tab-dn-or-im-se-in-c1, var(--_ctm-dn-or-im-se-in-c1)));
720
+ stroke: var(
721
+ --_ctm-mob-dn-or-im-se-in-c1,
722
+ var(--_ctm-tab-dn-or-im-se-in-c1, var(--_ctm-dn-or-im-se-in-c1))
723
+ );
434
724
  // Overrides the stroke-width presentation attribute baked into the icon markup.
435
725
  stroke-width: prepareMediaVariable(--_ctm-dn-or-im-se-se-wh, 1.25);
436
726
  }
@@ -446,62 +736,110 @@ $resizeActive: '[data-cms-element-resizer="true"]';
446
736
  white-space: nowrap;
447
737
  align-items: center;
448
738
 
449
- background-color: var(--_ctm-mob-dn-ct-pe-im-se-bd-cr,
450
- var(--_ctm-tab-dn-ct-pe-im-se-bd-cr, var(--_ctm-dn-ct-pe-im-se-bd-cr)));
451
- border-color: var(--_ctm-mob-dn-ct-pe-im-se-br-cr,
452
- var(--_ctm-tab-dn-ct-pe-im-se-br-cr, var(--_ctm-dn-ct-pe-im-se-br-cr)));
453
- border-radius: var(--_ctm-mob-dn-ct-pe-im-se-br-rs,
454
- var(--_ctm-tab-dn-ct-pe-im-se-br-rs, var(--_ctm-dn-ct-pe-im-se-br-rs)));
455
- border-style: var(--_ctm-mob-dn-ct-pe-im-se-br-se,
456
- var(--_ctm-tab-dn-ct-pe-im-se-br-se, var(--_ctm-dn-ct-pe-im-se-br-se)));
457
- border-width: var(--_ctm-mob-dn-ct-pe-im-se-br-wh,
458
- var(--_ctm-tab-dn-ct-pe-im-se-br-wh, var(--_ctm-dn-ct-pe-im-se-br-wh)));
459
- color: var(--_ctm-mob-dn-ct-pe-im-se-cr,
460
- var(--_ctm-tab-dn-ct-pe-im-se-cr, var(--_ctm-dn-ct-pe-im-se-cr)));
461
- font-family: var(--_ctm-mob-dn-ct-pe-im-se-ft-fy,
462
- var(--_ctm-tab-dn-ct-pe-im-se-ft-fy, var(--_ctm-dn-ct-pe-im-se-ft-fy)));
463
-
739
+ background-color: var(
740
+ --_ctm-mob-dn-ct-pe-im-se-bd-cr,
741
+ var(--_ctm-tab-dn-ct-pe-im-se-bd-cr, var(--_ctm-dn-ct-pe-im-se-bd-cr))
742
+ );
743
+ border-color: var(
744
+ --_ctm-mob-dn-ct-pe-im-se-br-cr,
745
+ var(--_ctm-tab-dn-ct-pe-im-se-br-cr, var(--_ctm-dn-ct-pe-im-se-br-cr))
746
+ );
747
+ border-radius: var(
748
+ --_ctm-mob-dn-ct-pe-im-se-br-rs,
749
+ var(--_ctm-tab-dn-ct-pe-im-se-br-rs, var(--_ctm-dn-ct-pe-im-se-br-rs))
750
+ );
751
+ border-style: var(
752
+ --_ctm-mob-dn-ct-pe-im-se-br-se,
753
+ var(--_ctm-tab-dn-ct-pe-im-se-br-se, var(--_ctm-dn-ct-pe-im-se-br-se))
754
+ );
755
+ border-width: var(
756
+ --_ctm-mob-dn-ct-pe-im-se-br-wh,
757
+ var(--_ctm-tab-dn-ct-pe-im-se-br-wh, var(--_ctm-dn-ct-pe-im-se-br-wh))
758
+ );
759
+ color: var(
760
+ --_ctm-mob-dn-ct-pe-im-se-cr,
761
+ var(--_ctm-tab-dn-ct-pe-im-se-cr, var(--_ctm-dn-ct-pe-im-se-cr))
762
+ );
763
+ font-family: var(
764
+ --_ctm-mob-dn-ct-pe-im-se-ft-fy,
765
+ var(--_ctm-tab-dn-ct-pe-im-se-ft-fy, var(--_ctm-dn-ct-pe-im-se-ft-fy))
766
+ );
464
767
  &.flex__overflow {
465
768
  white-space: normal;
466
769
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
467
770
  }
468
-
469
- font-size: var(--_ctm-mob-dn-ct-pe-im-se-ft-se,
470
- var(--_ctm-tab-dn-ct-pe-im-se-ft-se, var(--_ctm-dn-ct-pe-im-se-ft-se)));
471
- font-style: var(--_ctm-mob-dn-ct-pe-im-se-ft-se-ic,
472
- var(--_ctm-tab-dn-ct-pe-im-se-ft-se-ic, var(--_ctm-dn-ct-pe-im-se-ft-se-ic)));
473
- font-weight: var(--_ctm-mob-dn-ct-pe-im-se-ft-wt,
474
- var(--_ctm-tab-dn-ct-pe-im-se-ft-wt, var(--_ctm-dn-ct-pe-im-se-ft-wt)));
475
- line-height: var(--_ctm-mob-dn-ct-pe-im-se-le-ht,
476
- var(--_ctm-tab-dn-ct-pe-im-se-le-ht, var(--_ctm-dn-ct-pe-im-se-le-ht)));
477
- letter-spacing: var(--_ctm-mob-dn-ct-pe-im-se-lr-sg,
478
- var(--_ctm-tab-dn-ct-pe-im-se-lr-sg, var(--_ctm-dn-ct-pe-im-se-lr-sg)));
479
- text-align: var(--_ctm-mob-dn-ct-pe-im-se-tt-an,
480
- var(--_ctm-tab-dn-ct-pe-im-se-tt-an, var(--_ctm-dn-ct-pe-im-se-tt-an)));
481
- text-decoration: var(--_ctm-mob-dn-ct-pe-im-se-ue,
482
- var(--_ctm-tab-dn-ct-pe-im-se-ue, var(--_ctm-dn-ct-pe-im-se-ue)));
483
- text-transform: var(--_ctm-mob-dn-ct-pe-im-se-tt-tm,
484
- var(--_ctm-tab-dn-ct-pe-im-se-tt-tm, var(--_ctm-dn-ct-pe-im-se-tt-tm, none)));
485
- word-wrap: var(--_ctm-mob-dn-ct-pe-im-se-wd-wp,
486
- var(--_ctm-tab-dn-ct-pe-im-se-wd-wp, var(--_ctm-dn-ct-pe-im-se-wd-wp, normal)));
487
- word-break: var(--_ctm-mob-dn-ct-pe-im-se-wd-bk,
488
- var(--_ctm-tab-dn-ct-pe-im-se-wd-bk, var(--_ctm-dn-ct-pe-im-se-wd-bk, normal)));
489
- box-shadow: var(--_ctm-mob-dn-ct-pe-im-se-sw-ae,
490
- var(--_ctm-tab-dn-ct-pe-im-se-sw-ae, var(--_ctm-dn-ct-pe-im-se-sw-ae))) var(--_ctm-mob-dn-ct-pe-im-se-sw-sd,
491
- var(--_ctm-tab-dn-ct-pe-im-se-sw-sd, var(--_ctm-dn-ct-pe-im-se-sw-sd))) var(--_ctm-mob-dn-he-pe-im-se-sw-sd,
492
- var(--_ctm-tab-dn-he-pe-im-se-sw-sd, var(--_ctm-dn-he-pe-im-se-sw-sd))) var(--_ctm-mob-dn-ct-pe-im-se-sw-cr,
493
- var(--_ctm-tab-dn-ct-pe-im-se-sw-cr, var(--_ctm-dn-ct-pe-im-se-sw-cr)));
771
+ font-size: var(
772
+ --_ctm-mob-dn-ct-pe-im-se-ft-se,
773
+ var(--_ctm-tab-dn-ct-pe-im-se-ft-se, var(--_ctm-dn-ct-pe-im-se-ft-se))
774
+ );
775
+ font-style: var(
776
+ --_ctm-mob-dn-ct-pe-im-se-ft-se-ic,
777
+ var(--_ctm-tab-dn-ct-pe-im-se-ft-se-ic, var(--_ctm-dn-ct-pe-im-se-ft-se-ic))
778
+ );
779
+ font-weight: var(
780
+ --_ctm-mob-dn-ct-pe-im-se-ft-wt,
781
+ var(--_ctm-tab-dn-ct-pe-im-se-ft-wt, var(--_ctm-dn-ct-pe-im-se-ft-wt))
782
+ );
783
+ line-height: var(
784
+ --_ctm-mob-dn-ct-pe-im-se-le-ht,
785
+ var(--_ctm-tab-dn-ct-pe-im-se-le-ht, var(--_ctm-dn-ct-pe-im-se-le-ht))
786
+ );
787
+ letter-spacing: var(
788
+ --_ctm-mob-dn-ct-pe-im-se-lr-sg,
789
+ var(--_ctm-tab-dn-ct-pe-im-se-lr-sg, var(--_ctm-dn-ct-pe-im-se-lr-sg))
790
+ );
791
+ text-align: var(
792
+ --_ctm-mob-dn-ct-pe-im-se-tt-an,
793
+ var(--_ctm-tab-dn-ct-pe-im-se-tt-an, var(--_ctm-dn-ct-pe-im-se-tt-an))
794
+ );
795
+ text-decoration: var(
796
+ --_ctm-mob-dn-ct-pe-im-se-ue,
797
+ var(--_ctm-tab-dn-ct-pe-im-se-ue, var(--_ctm-dn-ct-pe-im-se-ue))
798
+ );
799
+ text-transform: var(
800
+ --_ctm-mob-dn-ct-pe-im-se-tt-tm,
801
+ var(--_ctm-tab-dn-ct-pe-im-se-tt-tm, var(--_ctm-dn-ct-pe-im-se-tt-tm, none))
802
+ );
803
+ word-wrap: var(
804
+ --_ctm-mob-dn-ct-pe-im-se-wd-wp,
805
+ var(--_ctm-tab-dn-ct-pe-im-se-wd-wp, var(--_ctm-dn-ct-pe-im-se-wd-wp, normal))
806
+ );
807
+ word-break: var(
808
+ --_ctm-mob-dn-ct-pe-im-se-wd-bk,
809
+ var(--_ctm-tab-dn-ct-pe-im-se-wd-bk, var(--_ctm-dn-ct-pe-im-se-wd-bk, normal))
810
+ );
811
+ box-shadow: var(
812
+ --_ctm-mob-dn-ct-pe-im-se-sw-ae,
813
+ var(--_ctm-tab-dn-ct-pe-im-se-sw-ae, var(--_ctm-dn-ct-pe-im-se-sw-ae))
814
+ )
815
+ var(
816
+ --_ctm-mob-dn-ct-pe-im-se-sw-sd,
817
+ var(--_ctm-tab-dn-ct-pe-im-se-sw-sd, var(--_ctm-dn-ct-pe-im-se-sw-sd))
818
+ )
819
+ var(
820
+ --_ctm-mob-dn-he-pe-im-se-sw-sd,
821
+ var(--_ctm-tab-dn-he-pe-im-se-sw-sd, var(--_ctm-dn-he-pe-im-se-sw-sd))
822
+ )
823
+ var(
824
+ --_ctm-mob-dn-ct-pe-im-se-sw-cr,
825
+ var(--_ctm-tab-dn-ct-pe-im-se-sw-cr, var(--_ctm-dn-ct-pe-im-se-sw-cr))
826
+ );
494
827
 
495
828
  .icon {
496
829
  svg {
497
- width: var(--_ctm-mob-dn-ct-pe-im-se-in-se,
498
- var(--_ctm-tab-dn-ct-pe-im-se-in-se, var(--_ctm-dn-ct-pe-im-se-in-se)));
499
- height: var(--_ctm-mob-dn-ct-pe-im-se-in-se,
500
- var(--_ctm-tab-dn-ct-pe-im-se-in-se, var(--_ctm-dn-ct-pe-im-se-in-se)));
501
-
830
+ width: var(
831
+ --_ctm-mob-dn-ct-pe-im-se-in-se,
832
+ var(--_ctm-tab-dn-ct-pe-im-se-in-se, var(--_ctm-dn-ct-pe-im-se-in-se))
833
+ );
834
+ height: var(
835
+ --_ctm-mob-dn-ct-pe-im-se-in-se,
836
+ var(--_ctm-tab-dn-ct-pe-im-se-in-se, var(--_ctm-dn-ct-pe-im-se-in-se))
837
+ );
502
838
  path {
503
- stroke: var(--_ctm-mob-dn-ct-pe-im-se-in-c1,
504
- var(--_ctm-tab-dn-ct-pe-im-se-in-c1, var(--_ctm-dn-ct-pe-im-se-in-c1)));
839
+ stroke: var(
840
+ --_ctm-mob-dn-ct-pe-im-se-in-c1,
841
+ var(--_ctm-tab-dn-ct-pe-im-se-in-c1, var(--_ctm-dn-ct-pe-im-se-in-c1))
842
+ );
505
843
  // Overrides the stroke-width presentation attribute baked into the icon markup.
506
844
  stroke-width: prepareMediaVariable(--_ctm-dn-ct-pe-im-se-se-wh, 1.25);
507
845
  }
@@ -515,16 +853,20 @@ $resizeActive: '[data-cms-element-resizer="true"]';
515
853
  .separator {
516
854
  .icon {
517
855
  display: flex;
518
-
519
856
  svg {
520
- width: var(--_ctm-mob-dn-im-sr-in-se,
521
- var(--_ctm-tab-dn-im-sr-in-se, var(--_ctm-dn-im-sr-in-se)));
522
- height: var(--_ctm-mob-dn-im-sr-in-se,
523
- var(--_ctm-tab-dn-im-sr-in-se, var(--_ctm-dn-im-sr-in-se)));
524
-
857
+ width: var(
858
+ --_ctm-mob-dn-im-sr-in-se,
859
+ var(--_ctm-tab-dn-im-sr-in-se, var(--_ctm-dn-im-sr-in-se))
860
+ );
861
+ height: var(
862
+ --_ctm-mob-dn-im-sr-in-se,
863
+ var(--_ctm-tab-dn-im-sr-in-se, var(--_ctm-dn-im-sr-in-se))
864
+ );
525
865
  path {
526
- stroke: var(--_ctm-mob-dn-im-sr-in-c1,
527
- var(--_ctm-tab-dn-im-sr-in-c1, var(--_ctm-dn-im-sr-in-c1)));
866
+ stroke: var(
867
+ --_ctm-mob-dn-im-sr-in-c1,
868
+ var(--_ctm-tab-dn-im-sr-in-c1, var(--_ctm-dn-im-sr-in-c1))
869
+ );
528
870
  // Overrides the stroke-width presentation attribute baked into the icon markup.
529
871
  stroke-width: prepareMediaVariable(--_ctm-dn-im-sr-se-wh, 1.25);
530
872
  }
@@ -539,21 +881,26 @@ $resizeActive: '[data-cms-element-resizer="true"]';
539
881
  .collapse_btn,
540
882
  .show_more_btn {
541
883
  white-space: nowrap;
542
- background-color: var(--_ctm-mob-dn-ed-in-bd-cr,
543
- var(--_ctm-tab-dn-ed-in-bd-cr, var(--_ctm-dn-ed-in-bd-cr)));
544
-
884
+ background-color: var(
885
+ --_ctm-mob-dn-ed-in-bd-cr,
886
+ var(--_ctm-tab-dn-ed-in-bd-cr, var(--_ctm-dn-ed-in-bd-cr))
887
+ );
545
888
  .icon {
546
889
  display: flex;
547
-
548
890
  svg {
549
- width: var(--_ctm-mob-dn-ed-in-in-se,
550
- var(--_ctm-tab-dn-ed-in-in-se, var(--_ctm-dn-ed-in-in-se)));
551
- height: var(--_ctm-mob-dn-ed-in-in-se,
552
- var(--_ctm-tab-dn-ed-in-in-se, var(--_ctm-dn-ed-in-in-se)));
553
-
891
+ width: var(
892
+ --_ctm-mob-dn-ed-in-in-se,
893
+ var(--_ctm-tab-dn-ed-in-in-se, var(--_ctm-dn-ed-in-in-se))
894
+ );
895
+ height: var(
896
+ --_ctm-mob-dn-ed-in-in-se,
897
+ var(--_ctm-tab-dn-ed-in-in-se, var(--_ctm-dn-ed-in-in-se))
898
+ );
554
899
  path {
555
- stroke: var(--_ctm-mob-dn-ed-in-in-c1,
556
- var(--_ctm-tab-dn-ed-in-in-c1, var(--_ctm-dn-ed-in-in-c1)));
900
+ stroke: var(
901
+ --_ctm-mob-dn-ed-in-in-c1,
902
+ var(--_ctm-tab-dn-ed-in-in-c1, var(--_ctm-dn-ed-in-in-c1))
903
+ );
557
904
  // Overrides the stroke-width presentation attribute baked into the icon markup.
558
905
  stroke-width: prepareMediaVariable(--_ctm-dn-ed-in-se-wh, 1.25);
559
906
  }
@@ -578,27 +925,42 @@ $resizeActive: '[data-cms-element-resizer="true"]';
578
925
  // home and current items, which have their own borders and their own switches.
579
926
  // Background & Fill's border lives on .wrapper, which is where both trail layouts
580
927
  // now take it from — so the switch has to target that, not the inner trail wrappers.
581
- &[data-trail-border="false"]>div.wrapper {
928
+ &[data-trail-border="false"] > div.wrapper {
582
929
  border-width: 0;
583
930
  border-style: none;
584
931
  }
585
-
586
- &[data-other-border="false"]>div .horizontal_breadcrumb_wrapper .breadcrumb_item:not(:first-of-type):not(:last-of-type),
587
- &[data-other-border="false"]>div .vertical_breadcrumb_wrapper .item_wrapper:not(:first-of-type):not(:last-of-type) .breadcrumb_item {
932
+ &[data-other-border="false"]
933
+ > div
934
+ .horizontal_breadcrumb_wrapper
935
+ .breadcrumb_item:not(:first-of-type):not(:last-of-type),
936
+ &[data-other-border="false"]
937
+ > div
938
+ .vertical_breadcrumb_wrapper
939
+ .item_wrapper:not(:first-of-type):not(:last-of-type)
940
+ .breadcrumb_item {
588
941
  border-width: 0;
589
942
  border-style: none;
590
943
  }
591
-
592
- &[data-home-border="false"]>div .horizontal_breadcrumb_wrapper .breadcrumb_item:first-of-type,
593
- &[data-home-border="false"]>div .vertical_breadcrumb_wrapper .item_wrapper:first-of-type .breadcrumb_item {
944
+ &[data-home-border="false"] > div .horizontal_breadcrumb_wrapper .breadcrumb_item:first-of-type,
945
+ &[data-home-border="false"]
946
+ > div
947
+ .vertical_breadcrumb_wrapper
948
+ .item_wrapper:first-of-type
949
+ .breadcrumb_item {
594
950
  border-width: 0;
595
951
  border-style: none;
596
952
  }
597
-
598
- &[data-current-border="false"]>div .horizontal_breadcrumb_wrapper .breadcrumb_item:last-of-type,
599
- &[data-current-border="false"]>div .vertical_breadcrumb_wrapper .item_wrapper:last-of-type .breadcrumb_item {
953
+ &[data-current-border="false"]
954
+ > div
955
+ .horizontal_breadcrumb_wrapper
956
+ .breadcrumb_item:last-of-type,
957
+ &[data-current-border="false"]
958
+ > div
959
+ .vertical_breadcrumb_wrapper
960
+ .item_wrapper:last-of-type
961
+ .breadcrumb_item {
600
962
  border-width: 0;
601
963
  border-style: none;
602
964
  }
603
965
  }
604
- }
966
+ }