@syncfusion/ej2-dropdowns 32.1.24 → 32.2.3

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 (268) hide show
  1. package/.eslintrc.json +263 -0
  2. package/aceconfig.js +17 -0
  3. package/dist/ej2-dropdowns.min.js +2 -2
  4. package/dist/ej2-dropdowns.umd.min.js +2 -2
  5. package/dist/ej2-dropdowns.umd.min.js.map +1 -1
  6. package/dist/es6/ej2-dropdowns.es2015.js +14 -6
  7. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  8. package/dist/es6/ej2-dropdowns.es5.js +14 -6
  9. package/dist/es6/ej2-dropdowns.es5.js.map +1 -1
  10. package/dist/global/ej2-dropdowns.min.js +2 -2
  11. package/dist/global/ej2-dropdowns.min.js.map +1 -1
  12. package/dist/global/index.d.ts +1 -1
  13. package/package.json +8 -8
  14. package/src/drop-down-list/drop-down-list.js +1 -1
  15. package/src/multi-select/multi-select.js +13 -5
  16. package/styles/bds-lite.css +898 -898
  17. package/styles/bds.css +1302 -1302
  18. package/styles/bootstrap-dark-lite.css +870 -870
  19. package/styles/bootstrap-dark.css +1275 -1275
  20. package/styles/bootstrap-lite.css +867 -867
  21. package/styles/bootstrap.css +1278 -1278
  22. package/styles/bootstrap4-lite.css +1408 -1408
  23. package/styles/bootstrap4.css +1721 -1721
  24. package/styles/bootstrap5-dark-lite.css +1769 -1769
  25. package/styles/bootstrap5-dark.css +1710 -1710
  26. package/styles/bootstrap5-lite.css +1396 -1396
  27. package/styles/bootstrap5.3-lite.css +1138 -1138
  28. package/styles/bootstrap5.3.css +1592 -1592
  29. package/styles/bootstrap5.css +1711 -1711
  30. package/styles/drop-down-base/_all.bds.scss +1 -1
  31. package/styles/drop-down-base/_all.bootstrap-dark.scss +1 -1
  32. package/styles/drop-down-base/_all.bootstrap.scss +1 -1
  33. package/styles/drop-down-base/_all.bootstrap4.scss +1 -1
  34. package/styles/drop-down-base/_all.bootstrap5-dark.scss +1 -1
  35. package/styles/drop-down-base/_all.bootstrap5.3.scss +1 -1
  36. package/styles/drop-down-base/_all.bootstrap5.scss +1 -1
  37. package/styles/drop-down-base/_all.fabric-dark.scss +1 -1
  38. package/styles/drop-down-base/_all.fabric.scss +1 -1
  39. package/styles/drop-down-base/_all.fluent-dark.scss +1 -1
  40. package/styles/drop-down-base/_all.fluent.scss +1 -1
  41. package/styles/drop-down-base/_all.fluent2.scss +1 -1
  42. package/styles/drop-down-base/_all.highcontrast-light.scss +1 -1
  43. package/styles/drop-down-base/_all.highcontrast.scss +1 -1
  44. package/styles/drop-down-base/_all.material-dark.scss +1 -1
  45. package/styles/drop-down-base/_all.material.scss +1 -1
  46. package/styles/drop-down-base/_all.material3-dark.scss +1 -1
  47. package/styles/drop-down-base/_all.material3.scss +1 -1
  48. package/styles/drop-down-base/_all.tailwind-dark.scss +1 -1
  49. package/styles/drop-down-base/_all.tailwind.scss +1 -1
  50. package/styles/drop-down-base/_all.tailwind3.scss +1 -1
  51. package/styles/drop-down-base/bds.css +164 -164
  52. package/styles/drop-down-base/bootstrap-dark.css +130 -130
  53. package/styles/drop-down-base/bootstrap.css +130 -130
  54. package/styles/drop-down-base/bootstrap4.css +136 -136
  55. package/styles/drop-down-base/bootstrap5-dark.css +143 -143
  56. package/styles/drop-down-base/bootstrap5.3.css +219 -219
  57. package/styles/drop-down-base/bootstrap5.css +143 -143
  58. package/styles/drop-down-base/fabric-dark.css +130 -130
  59. package/styles/drop-down-base/fabric.css +130 -130
  60. package/styles/drop-down-base/fluent-dark.css +148 -148
  61. package/styles/drop-down-base/fluent.css +148 -148
  62. package/styles/drop-down-base/fluent2.css +215 -215
  63. package/styles/drop-down-base/highcontrast-light.css +146 -146
  64. package/styles/drop-down-base/highcontrast.css +146 -146
  65. package/styles/drop-down-base/material-dark.css +130 -130
  66. package/styles/drop-down-base/material.css +130 -130
  67. package/styles/drop-down-base/material3-dark.css +212 -212
  68. package/styles/drop-down-base/material3.css +214 -214
  69. package/styles/drop-down-base/tailwind-dark.css +155 -155
  70. package/styles/drop-down-base/tailwind.css +155 -155
  71. package/styles/drop-down-base/tailwind3.css +215 -215
  72. package/styles/drop-down-list/_all.bds.scss +1 -1
  73. package/styles/drop-down-list/_all.bootstrap-dark.scss +1 -1
  74. package/styles/drop-down-list/_all.bootstrap.scss +1 -1
  75. package/styles/drop-down-list/_all.bootstrap4.scss +1 -1
  76. package/styles/drop-down-list/_all.bootstrap5-dark.scss +1 -1
  77. package/styles/drop-down-list/_all.bootstrap5.3.scss +1 -1
  78. package/styles/drop-down-list/_all.bootstrap5.scss +1 -1
  79. package/styles/drop-down-list/_all.fabric-dark.scss +1 -1
  80. package/styles/drop-down-list/_all.fabric.scss +1 -1
  81. package/styles/drop-down-list/_all.fluent-dark.scss +1 -1
  82. package/styles/drop-down-list/_all.fluent.scss +1 -1
  83. package/styles/drop-down-list/_all.fluent2.scss +1 -1
  84. package/styles/drop-down-list/_all.highcontrast-light.scss +1 -1
  85. package/styles/drop-down-list/_all.highcontrast.scss +1 -1
  86. package/styles/drop-down-list/_all.material-dark.scss +1 -1
  87. package/styles/drop-down-list/_all.material.scss +1 -1
  88. package/styles/drop-down-list/_all.material3-dark.scss +1 -1
  89. package/styles/drop-down-list/_all.material3.scss +1 -1
  90. package/styles/drop-down-list/_all.tailwind-dark.scss +1 -1
  91. package/styles/drop-down-list/_all.tailwind.scss +1 -1
  92. package/styles/drop-down-list/_all.tailwind3.scss +1 -1
  93. package/styles/drop-down-list/bds.css +87 -87
  94. package/styles/drop-down-list/bootstrap-dark.css +74 -74
  95. package/styles/drop-down-list/bootstrap.css +74 -74
  96. package/styles/drop-down-list/bootstrap4.css +111 -111
  97. package/styles/drop-down-list/bootstrap5-dark.css +113 -113
  98. package/styles/drop-down-list/bootstrap5.3.css +197 -197
  99. package/styles/drop-down-list/bootstrap5.css +113 -113
  100. package/styles/drop-down-list/fabric-dark.css +48 -48
  101. package/styles/drop-down-list/fabric.css +48 -48
  102. package/styles/drop-down-list/fluent-dark.css +105 -105
  103. package/styles/drop-down-list/fluent.css +105 -105
  104. package/styles/drop-down-list/fluent2.css +204 -204
  105. package/styles/drop-down-list/highcontrast-light.css +63 -63
  106. package/styles/drop-down-list/highcontrast.css +64 -64
  107. package/styles/drop-down-list/material-dark.css +96 -96
  108. package/styles/drop-down-list/material.css +100 -100
  109. package/styles/drop-down-list/material3-dark.css +235 -235
  110. package/styles/drop-down-list/material3.css +235 -235
  111. package/styles/drop-down-list/tailwind-dark.css +83 -83
  112. package/styles/drop-down-list/tailwind.css +83 -83
  113. package/styles/drop-down-list/tailwind3.css +186 -186
  114. package/styles/drop-down-tree/_all.bds.scss +1 -1
  115. package/styles/drop-down-tree/_all.bootstrap-dark.scss +1 -1
  116. package/styles/drop-down-tree/_all.bootstrap.scss +1 -1
  117. package/styles/drop-down-tree/_all.bootstrap4.scss +1 -1
  118. package/styles/drop-down-tree/_all.bootstrap5-dark.scss +1 -1
  119. package/styles/drop-down-tree/_all.bootstrap5.3.scss +1 -1
  120. package/styles/drop-down-tree/_all.bootstrap5.scss +1 -1
  121. package/styles/drop-down-tree/_all.fabric-dark.scss +1 -1
  122. package/styles/drop-down-tree/_all.fabric.scss +1 -1
  123. package/styles/drop-down-tree/_all.fluent-dark.scss +1 -1
  124. package/styles/drop-down-tree/_all.fluent.scss +1 -1
  125. package/styles/drop-down-tree/_all.fluent2.scss +1 -1
  126. package/styles/drop-down-tree/_all.highcontrast-light.scss +1 -1
  127. package/styles/drop-down-tree/_all.highcontrast.scss +1 -1
  128. package/styles/drop-down-tree/_all.material-dark.scss +1 -1
  129. package/styles/drop-down-tree/_all.material.scss +1 -1
  130. package/styles/drop-down-tree/_all.material3-dark.scss +1 -1
  131. package/styles/drop-down-tree/_all.material3.scss +1 -1
  132. package/styles/drop-down-tree/_all.tailwind-dark.scss +1 -1
  133. package/styles/drop-down-tree/_all.tailwind.scss +1 -1
  134. package/styles/drop-down-tree/_all.tailwind3.scss +1 -1
  135. package/styles/drop-down-tree/bds.css +56 -56
  136. package/styles/drop-down-tree/bootstrap-dark.css +33 -33
  137. package/styles/drop-down-tree/bootstrap.css +33 -33
  138. package/styles/drop-down-tree/bootstrap4.css +39 -39
  139. package/styles/drop-down-tree/bootstrap5-dark.css +40 -40
  140. package/styles/drop-down-tree/bootstrap5.3.css +124 -124
  141. package/styles/drop-down-tree/bootstrap5.css +40 -40
  142. package/styles/drop-down-tree/fabric-dark.css +33 -33
  143. package/styles/drop-down-tree/fabric.css +33 -33
  144. package/styles/drop-down-tree/fluent-dark.css +33 -33
  145. package/styles/drop-down-tree/fluent.css +33 -33
  146. package/styles/drop-down-tree/fluent2.css +122 -122
  147. package/styles/drop-down-tree/highcontrast-light.css +33 -33
  148. package/styles/drop-down-tree/highcontrast.css +42 -42
  149. package/styles/drop-down-tree/material-dark.css +33 -33
  150. package/styles/drop-down-tree/material.css +33 -33
  151. package/styles/drop-down-tree/material3-dark.css +115 -115
  152. package/styles/drop-down-tree/material3.css +117 -117
  153. package/styles/drop-down-tree/tailwind-dark.css +52 -52
  154. package/styles/drop-down-tree/tailwind.css +52 -52
  155. package/styles/drop-down-tree/tailwind3.css +107 -107
  156. package/styles/fabric-dark-lite.css +877 -877
  157. package/styles/fabric-dark.css +1274 -1274
  158. package/styles/fabric-lite.css +877 -877
  159. package/styles/fabric.css +1147 -1147
  160. package/styles/fluent-dark-lite.css +1765 -1765
  161. package/styles/fluent-dark.css +1718 -1718
  162. package/styles/fluent-lite.css +1765 -1765
  163. package/styles/fluent.css +1718 -1718
  164. package/styles/fluent2-lite.css +2081 -2081
  165. package/styles/fluent2.css +1703 -1703
  166. package/styles/highcontrast-light-lite.css +1412 -1412
  167. package/styles/highcontrast-light.css +1760 -1760
  168. package/styles/highcontrast-lite.css +1751 -1751
  169. package/styles/highcontrast.css +1768 -1768
  170. package/styles/list-box/_all.bds.scss +1 -1
  171. package/styles/list-box/_all.bootstrap-dark.scss +1 -1
  172. package/styles/list-box/_all.bootstrap.scss +1 -1
  173. package/styles/list-box/_all.bootstrap4.scss +1 -1
  174. package/styles/list-box/_all.bootstrap5-dark.scss +1 -1
  175. package/styles/list-box/_all.bootstrap5.3.scss +1 -1
  176. package/styles/list-box/_all.bootstrap5.scss +1 -1
  177. package/styles/list-box/_all.fabric-dark.scss +1 -1
  178. package/styles/list-box/_all.fabric.scss +1 -1
  179. package/styles/list-box/_all.fluent-dark.scss +1 -1
  180. package/styles/list-box/_all.fluent.scss +1 -1
  181. package/styles/list-box/_all.fluent2.scss +1 -1
  182. package/styles/list-box/_all.highcontrast-light.scss +1 -1
  183. package/styles/list-box/_all.highcontrast.scss +1 -1
  184. package/styles/list-box/_all.material-dark.scss +1 -1
  185. package/styles/list-box/_all.material.scss +1 -1
  186. package/styles/list-box/_all.material3-dark.scss +1 -1
  187. package/styles/list-box/_all.material3.scss +1 -1
  188. package/styles/list-box/_all.tailwind-dark.scss +1 -1
  189. package/styles/list-box/_all.tailwind.scss +1 -1
  190. package/styles/list-box/_all.tailwind3.scss +1 -1
  191. package/styles/list-box/bds.css +654 -654
  192. package/styles/list-box/bootstrap-dark.css +644 -644
  193. package/styles/list-box/bootstrap.css +649 -649
  194. package/styles/list-box/bootstrap4.css +649 -649
  195. package/styles/list-box/bootstrap5-dark.css +649 -649
  196. package/styles/list-box/bootstrap5.3.css +659 -659
  197. package/styles/list-box/bootstrap5.css +649 -649
  198. package/styles/list-box/fabric-dark.css +644 -644
  199. package/styles/list-box/fabric.css +649 -649
  200. package/styles/list-box/fluent-dark.css +649 -649
  201. package/styles/list-box/fluent.css +649 -649
  202. package/styles/list-box/fluent2.css +692 -692
  203. package/styles/list-box/highcontrast-light.css +644 -644
  204. package/styles/list-box/highcontrast.css +649 -649
  205. package/styles/list-box/material-dark.css +643 -643
  206. package/styles/list-box/material.css +648 -648
  207. package/styles/list-box/material3-dark.css +659 -659
  208. package/styles/list-box/material3.css +659 -659
  209. package/styles/list-box/tailwind-dark.css +640 -640
  210. package/styles/list-box/tailwind.css +640 -640
  211. package/styles/list-box/tailwind3.css +698 -698
  212. package/styles/material-dark-lite.css +1566 -1566
  213. package/styles/material-dark.css +2278 -2278
  214. package/styles/material-lite.css +1659 -1659
  215. package/styles/material.css +1921 -1921
  216. package/styles/material3-dark-lite.css +2644 -2644
  217. package/styles/material3-dark.css +2687 -2687
  218. package/styles/material3-lite.css +2663 -2663
  219. package/styles/material3.css +2684 -2684
  220. package/styles/multi-select/_all.bds.scss +1 -1
  221. package/styles/multi-select/_all.bootstrap-dark.scss +1 -1
  222. package/styles/multi-select/_all.bootstrap.scss +1 -1
  223. package/styles/multi-select/_all.bootstrap4.scss +1 -1
  224. package/styles/multi-select/_all.bootstrap5-dark.scss +1 -1
  225. package/styles/multi-select/_all.bootstrap5.3.scss +1 -1
  226. package/styles/multi-select/_all.bootstrap5.scss +1 -1
  227. package/styles/multi-select/_all.fabric-dark.scss +1 -1
  228. package/styles/multi-select/_all.fabric.scss +1 -1
  229. package/styles/multi-select/_all.fluent-dark.scss +1 -1
  230. package/styles/multi-select/_all.fluent.scss +1 -1
  231. package/styles/multi-select/_all.fluent2.scss +1 -1
  232. package/styles/multi-select/_all.highcontrast-light.scss +1 -1
  233. package/styles/multi-select/_all.highcontrast.scss +1 -1
  234. package/styles/multi-select/_all.material-dark.scss +1 -1
  235. package/styles/multi-select/_all.material.scss +1 -1
  236. package/styles/multi-select/_all.material3-dark.scss +1 -1
  237. package/styles/multi-select/_all.material3.scss +1 -1
  238. package/styles/multi-select/_all.tailwind-dark.scss +1 -1
  239. package/styles/multi-select/_all.tailwind.scss +1 -1
  240. package/styles/multi-select/_all.tailwind3.scss +1 -1
  241. package/styles/multi-select/bds.css +221 -221
  242. package/styles/multi-select/bootstrap-dark.css +231 -231
  243. package/styles/multi-select/bootstrap.css +224 -224
  244. package/styles/multi-select/bootstrap4.css +676 -676
  245. package/styles/multi-select/bootstrap5-dark.css +235 -235
  246. package/styles/multi-select/bootstrap5.3.css +336 -336
  247. package/styles/multi-select/bootstrap5.css +235 -235
  248. package/styles/multi-select/fabric-dark.css +225 -225
  249. package/styles/multi-select/fabric.css +220 -220
  250. package/styles/multi-select/fluent-dark.css +677 -677
  251. package/styles/multi-select/fluent.css +677 -677
  252. package/styles/multi-select/fluent2.css +959 -959
  253. package/styles/multi-select/highcontrast-light.css +789 -789
  254. package/styles/multi-select/highcontrast.css +793 -793
  255. package/styles/multi-select/material-dark.css +918 -918
  256. package/styles/multi-select/material.css +920 -920
  257. package/styles/multi-select/material3-dark.css +1330 -1330
  258. package/styles/multi-select/material3.css +1334 -1334
  259. package/styles/multi-select/tailwind-dark.css +217 -217
  260. package/styles/multi-select/tailwind.css +217 -217
  261. package/styles/multi-select/tailwind3.css +326 -326
  262. package/styles/tailwind-dark-lite.css +861 -861
  263. package/styles/tailwind-dark.css +1263 -1263
  264. package/styles/tailwind-lite.css +862 -862
  265. package/styles/tailwind.css +1263 -1263
  266. package/styles/tailwind3-lite.css +1114 -1114
  267. package/styles/tailwind3.css +2339 -2339
  268. package/tslint.json +111 -0
@@ -201,6 +201,245 @@
201
201
 
202
202
 
203
203
 
204
+ .e-dropdownbase .e-list-item.e-active,
205
+ .e-dropdownbase .e-list-item.e-active.e-hover {
206
+ font-weight: 400;
207
+ }
208
+
209
+ .e-dropdownbase .e-list-group-item,
210
+ .e-fixed-head {
211
+ font-size: 12px;
212
+ text-transform: uppercase;
213
+ }
214
+
215
+ .e-small .e-dropdownbase .e-list-group-item,
216
+ .e-small .e-fixed-head,
217
+ .e-small.e-dropdownbase .e-list-group-item,
218
+ .e-small.e-fixed-head {
219
+ font-size: 10px;
220
+ }
221
+
222
+ .e-dropdownbase .e-list-item .e-list-icon {
223
+ padding: 0 8px 0 0;
224
+ }
225
+
226
+ .e-small .e-dropdownbase .e-list-item .e-list-icon {
227
+ padding: 0 4px 0 0;
228
+ }
229
+
230
+ /* stylelint-disable */
231
+ .e-dropdownbase .e-list-item {
232
+ border-radius: calc(var(--e-radius) * 0.375) !important;
233
+ }
234
+
235
+ .e-dropdownbase {
236
+ display: block;
237
+ height: 100%;
238
+ min-height: 36px;
239
+ position: relative;
240
+ width: 100%;
241
+ }
242
+ .e-dropdownbase .e-list-parent {
243
+ margin: 0;
244
+ padding: 0;
245
+ }
246
+
247
+ .e-dropdownbase .e-list-group-item, .e-dropdownbase .e-fixed-head {
248
+ cursor: default;
249
+ }
250
+
251
+ .e-dropdownbase .e-list-item {
252
+ cursor: pointer;
253
+ overflow: hidden;
254
+ position: relative;
255
+ text-overflow: ellipsis;
256
+ vertical-align: middle;
257
+ white-space: nowrap;
258
+ width: 100%;
259
+ }
260
+
261
+ .e-dropdownbase .e-list-item .e-list-icon {
262
+ font-size: 14px;
263
+ vertical-align: middle;
264
+ }
265
+
266
+ .e-dropdownbase .e-fixed-head {
267
+ position: absolute;
268
+ top: 0;
269
+ }
270
+
271
+ .e-dropdownbase.e-content {
272
+ overflow: auto;
273
+ position: relative;
274
+ }
275
+
276
+ .e-popup.e-ddl .e-dropdownbase.e-nodata,
277
+ .e-popup.e-mention .e-dropdownbase.e-nodata {
278
+ color: var(--color-sf-content-text-color);
279
+ cursor: default;
280
+ font-family: var(--e-font-family);
281
+ font-size: 14px;
282
+ padding: 14px 16px;
283
+ text-align: center;
284
+ }
285
+
286
+ .e-mention.e-popup {
287
+ background: var(--color-sf-content-bg-color);
288
+ border: 0;
289
+ -webkit-box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.21);
290
+ box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.21);
291
+ margin-top: 2px;
292
+ position: absolute;
293
+ }
294
+
295
+ .e-mention.e-popup .e-dropdownbase {
296
+ min-height: 32px;
297
+ }
298
+
299
+ .e-mention .e-dropdownbase .e-list-item .e-highlight {
300
+ display: inline;
301
+ font-weight: bold;
302
+ vertical-align: baseline;
303
+ }
304
+
305
+ .e-mention .e-mention-chip,
306
+ .e-mention .e-mention-chip:hover {
307
+ background: var(--color-sf-content-bg-color-alt2);
308
+ border-radius: calc(var(--e-radius) * 0.125);
309
+ border: none;
310
+ color: var(--color-sf-primary);
311
+ cursor: default;
312
+ }
313
+
314
+ .e-mention.e-editable-element {
315
+ border: 2px solid var(--color-sf-border-light);
316
+ height: auto;
317
+ min-height: 120px;
318
+ width: 100%;
319
+ }
320
+
321
+ .e-form-mirror-div {
322
+ white-space: pre-wrap;
323
+ }
324
+
325
+ .e-rtl .e-dropdownbase.e-dd-group .e-list-item {
326
+ padding-right: 12px;
327
+ }
328
+
329
+ .e-dropdownbase.e-dd-group .e-list-item {
330
+ padding-left: 12px;
331
+ text-indent: 0;
332
+ }
333
+
334
+ .e-small .e-dropdownbase.e-dd-group .e-list-item {
335
+ padding-left: 8px;
336
+ }
337
+
338
+ .e-popup.e-multi-select-list-wrapper.e-multiselect-group .e-dropdownbase.e-dd-group .e-list-group-item {
339
+ text-indent: 0;
340
+ }
341
+
342
+ .e-popup.e-multi-select-list-wrapper.e-multiselect-group .e-dropdownbase.e-dd-group .e-list-group-item {
343
+ cursor: pointer;
344
+ font-weight: normal;
345
+ overflow: hidden;
346
+ position: relative;
347
+ text-overflow: ellipsis;
348
+ vertical-align: middle;
349
+ white-space: nowrap;
350
+ width: 100%;
351
+ }
352
+
353
+ .e-rtl.e-multiselect-group .e-dropdownbase.e-dd-group .e-list-item {
354
+ padding-right: 12px;
355
+ }
356
+
357
+
358
+
359
+
360
+
361
+
362
+
363
+
364
+
365
+ /* Font Family */
366
+ /* Font Sizes */
367
+ /* Radius */
368
+ /* 1px */
369
+ /* 2px */
370
+ /* 3px */
371
+ /* 4px */
372
+ /* 5px */
373
+ /* 6px */
374
+ /* 7px */
375
+ /* 8px */
376
+ /* 9px */
377
+ /* 10px */
378
+ /* 11px */
379
+ /* 12px */
380
+ /* 13px */
381
+ /* 14px */
382
+ /* 15px */
383
+ /* 16px */
384
+ /* 17px */
385
+ /* 18px */
386
+ /* 19px */
387
+ /* 20px */
388
+ /* 21px */
389
+ /* 22px */
390
+ /* 23px */
391
+ /* 24px */
392
+ /* 25px */
393
+ /* 26px */
394
+ /* 27px */
395
+ /* 28px */
396
+ /* 29px */
397
+ /* 30px */
398
+ /* 31px */
399
+ /* 32px */
400
+ /* 33px */
401
+ /* 34px */
402
+ /* 35px */
403
+ /* 36px */
404
+ /* 37px */
405
+ /* 38px */
406
+ /* 39px */
407
+ /* 40px */
408
+ /* 41px */
409
+ /* 42px */
410
+ /* 43px */
411
+ /* 44px */
412
+ /* 45px */
413
+ /* 46px */
414
+ /* 47px */
415
+ /* 48px */
416
+ /* 49px */
417
+ /* 50px */
418
+ /* 5em */
419
+ /* 65% */
420
+ /* border */
421
+ /* 0px */
422
+ /* 1px */
423
+ /* 1.5px */
424
+ /* 2px */
425
+ /* 3px */
426
+ /* 4px */
427
+ /* 5px */
428
+ /* 6px */
429
+ /* 7px */
430
+ /* 8px */
431
+ /* 9px */
432
+ /* 10px */
433
+ /* 11px */
434
+ /* 12px */
435
+ /* 13px */
436
+ /* 14px */
437
+ /* 15px */
438
+ /* 16px */
439
+
440
+
441
+
442
+
204
443
  .e-dropdownbase .e-list-item.e-active,
205
444
  .e-dropdownbase .e-list-item.e-active.e-hover {
206
445
  font-weight: 400;
@@ -409,245 +648,6 @@
409
648
  background-color: var(--color-sf-content-bg-color-hover);
410
649
  }
411
650
 
412
-
413
-
414
-
415
-
416
-
417
-
418
-
419
-
420
- /* Font Family */
421
- /* Font Sizes */
422
- /* Radius */
423
- /* 1px */
424
- /* 2px */
425
- /* 3px */
426
- /* 4px */
427
- /* 5px */
428
- /* 6px */
429
- /* 7px */
430
- /* 8px */
431
- /* 9px */
432
- /* 10px */
433
- /* 11px */
434
- /* 12px */
435
- /* 13px */
436
- /* 14px */
437
- /* 15px */
438
- /* 16px */
439
- /* 17px */
440
- /* 18px */
441
- /* 19px */
442
- /* 20px */
443
- /* 21px */
444
- /* 22px */
445
- /* 23px */
446
- /* 24px */
447
- /* 25px */
448
- /* 26px */
449
- /* 27px */
450
- /* 28px */
451
- /* 29px */
452
- /* 30px */
453
- /* 31px */
454
- /* 32px */
455
- /* 33px */
456
- /* 34px */
457
- /* 35px */
458
- /* 36px */
459
- /* 37px */
460
- /* 38px */
461
- /* 39px */
462
- /* 40px */
463
- /* 41px */
464
- /* 42px */
465
- /* 43px */
466
- /* 44px */
467
- /* 45px */
468
- /* 46px */
469
- /* 47px */
470
- /* 48px */
471
- /* 49px */
472
- /* 50px */
473
- /* 5em */
474
- /* 65% */
475
- /* border */
476
- /* 0px */
477
- /* 1px */
478
- /* 1.5px */
479
- /* 2px */
480
- /* 3px */
481
- /* 4px */
482
- /* 5px */
483
- /* 6px */
484
- /* 7px */
485
- /* 8px */
486
- /* 9px */
487
- /* 10px */
488
- /* 11px */
489
- /* 12px */
490
- /* 13px */
491
- /* 14px */
492
- /* 15px */
493
- /* 16px */
494
-
495
-
496
-
497
-
498
- .e-dropdownbase .e-list-item.e-active,
499
- .e-dropdownbase .e-list-item.e-active.e-hover {
500
- font-weight: 400;
501
- }
502
-
503
- .e-dropdownbase .e-list-group-item,
504
- .e-fixed-head {
505
- font-size: 12px;
506
- text-transform: uppercase;
507
- }
508
-
509
- .e-small .e-dropdownbase .e-list-group-item,
510
- .e-small .e-fixed-head,
511
- .e-small.e-dropdownbase .e-list-group-item,
512
- .e-small.e-fixed-head {
513
- font-size: 10px;
514
- }
515
-
516
- .e-dropdownbase .e-list-item .e-list-icon {
517
- padding: 0 8px 0 0;
518
- }
519
-
520
- .e-small .e-dropdownbase .e-list-item .e-list-icon {
521
- padding: 0 4px 0 0;
522
- }
523
-
524
- /* stylelint-disable */
525
- .e-dropdownbase .e-list-item {
526
- border-radius: calc(var(--e-radius) * 0.375) !important;
527
- }
528
-
529
- .e-dropdownbase {
530
- display: block;
531
- height: 100%;
532
- min-height: 36px;
533
- position: relative;
534
- width: 100%;
535
- }
536
- .e-dropdownbase .e-list-parent {
537
- margin: 0;
538
- padding: 0;
539
- }
540
-
541
- .e-dropdownbase .e-list-group-item, .e-dropdownbase .e-fixed-head {
542
- cursor: default;
543
- }
544
-
545
- .e-dropdownbase .e-list-item {
546
- cursor: pointer;
547
- overflow: hidden;
548
- position: relative;
549
- text-overflow: ellipsis;
550
- vertical-align: middle;
551
- white-space: nowrap;
552
- width: 100%;
553
- }
554
-
555
- .e-dropdownbase .e-list-item .e-list-icon {
556
- font-size: 14px;
557
- vertical-align: middle;
558
- }
559
-
560
- .e-dropdownbase .e-fixed-head {
561
- position: absolute;
562
- top: 0;
563
- }
564
-
565
- .e-dropdownbase.e-content {
566
- overflow: auto;
567
- position: relative;
568
- }
569
-
570
- .e-popup.e-ddl .e-dropdownbase.e-nodata,
571
- .e-popup.e-mention .e-dropdownbase.e-nodata {
572
- color: var(--color-sf-content-text-color);
573
- cursor: default;
574
- font-family: var(--e-font-family);
575
- font-size: 14px;
576
- padding: 14px 16px;
577
- text-align: center;
578
- }
579
-
580
- .e-mention.e-popup {
581
- background: var(--color-sf-content-bg-color);
582
- border: 0;
583
- -webkit-box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.21);
584
- box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.21);
585
- margin-top: 2px;
586
- position: absolute;
587
- }
588
-
589
- .e-mention.e-popup .e-dropdownbase {
590
- min-height: 32px;
591
- }
592
-
593
- .e-mention .e-dropdownbase .e-list-item .e-highlight {
594
- display: inline;
595
- font-weight: bold;
596
- vertical-align: baseline;
597
- }
598
-
599
- .e-mention .e-mention-chip,
600
- .e-mention .e-mention-chip:hover {
601
- background: var(--color-sf-content-bg-color-alt2);
602
- border-radius: calc(var(--e-radius) * 0.125);
603
- border: none;
604
- color: var(--color-sf-primary);
605
- cursor: default;
606
- }
607
-
608
- .e-mention.e-editable-element {
609
- border: 2px solid var(--color-sf-border-light);
610
- height: auto;
611
- min-height: 120px;
612
- width: 100%;
613
- }
614
-
615
- .e-form-mirror-div {
616
- white-space: pre-wrap;
617
- }
618
-
619
- .e-rtl .e-dropdownbase.e-dd-group .e-list-item {
620
- padding-right: 12px;
621
- }
622
-
623
- .e-dropdownbase.e-dd-group .e-list-item {
624
- padding-left: 12px;
625
- text-indent: 0;
626
- }
627
-
628
- .e-small .e-dropdownbase.e-dd-group .e-list-item {
629
- padding-left: 8px;
630
- }
631
-
632
- .e-popup.e-multi-select-list-wrapper.e-multiselect-group .e-dropdownbase.e-dd-group .e-list-group-item {
633
- text-indent: 0;
634
- }
635
-
636
- .e-popup.e-multi-select-list-wrapper.e-multiselect-group .e-dropdownbase.e-dd-group .e-list-group-item {
637
- cursor: pointer;
638
- font-weight: normal;
639
- overflow: hidden;
640
- position: relative;
641
- text-overflow: ellipsis;
642
- vertical-align: middle;
643
- white-space: nowrap;
644
- width: 100%;
645
- }
646
-
647
- .e-rtl.e-multiselect-group .e-dropdownbase.e-dd-group .e-list-item {
648
- padding-right: 12px;
649
- }
650
-
651
651
  /* stylelint-disable property-no-vendor-prefix */
652
652
  @-webkit-keyframes e-input-ripple {
653
653
  100% {
@@ -1216,244 +1216,40 @@
1216
1216
  background-color: var(--color-sf-flyout-bg-color);
1217
1217
  }
1218
1218
 
1219
- .e-popup {
1220
- border-color: var(--color-sf-border-light);
1219
+ .e-ddl.e-lib.e-input-group:not(.e-float-input) .e-dropdownlist:not(.e-input) {
1220
+ width: 100%;
1221
+ border: 0 solid;
1221
1222
  }
1222
1223
 
1223
- .e-float-input.e-input-group.e-ddl.e-control.e-icon-anim > .e-float-text,
1224
- .e-float-input.e-input-focus.e-input-group.e-ddl.e-control.e-keyboard > .e-float-text {
1225
- color: var(--color-sf-content-text-color-selected);
1224
+ .e-popup.e-wide-popup.e-ddl-device.e-popup-close {
1225
+ display: block;
1226
+ visibility: hidden;
1226
1227
  }
1227
1228
 
1228
- .e-ddl.e-popup .e-filter-parent .e-input-group input.e-input-filter {
1229
- border-color: transparent;
1229
+ .e-popup-full-page {
1230
+ bottom: 0;
1231
+ left: 0;
1232
+ margin: 0;
1233
+ overflow: hidden;
1234
+ padding: 0;
1235
+ right: 0;
1236
+ top: 0;
1237
+ }
1238
+ .e-popup-full-page .e-popup-full-page.e-ddl.e-popup.e-ddl-device-filter {
1239
+ margin: 0;
1230
1240
  }
1231
1241
 
1242
+ .e-ddl.e-control-wrapper .e-ddl-disable-icon {
1243
+ position: relative;
1244
+ }
1232
1245
 
1246
+ .e-ddl.e-control-wrapper .e-ddl-disable-icon::before {
1247
+ content: "";
1248
+ }
1233
1249
 
1234
-
1235
-
1236
-
1237
-
1238
-
1239
-
1240
- /* Font Family */
1241
- /* Font Sizes */
1242
- /* Radius */
1243
- /* 1px */
1244
- /* 2px */
1245
- /* 3px */
1246
- /* 4px */
1247
- /* 5px */
1248
- /* 6px */
1249
- /* 7px */
1250
- /* 8px */
1251
- /* 9px */
1252
- /* 10px */
1253
- /* 11px */
1254
- /* 12px */
1255
- /* 13px */
1256
- /* 14px */
1257
- /* 15px */
1258
- /* 16px */
1259
- /* 17px */
1260
- /* 18px */
1261
- /* 19px */
1262
- /* 20px */
1263
- /* 21px */
1264
- /* 22px */
1265
- /* 23px */
1266
- /* 24px */
1267
- /* 25px */
1268
- /* 26px */
1269
- /* 27px */
1270
- /* 28px */
1271
- /* 29px */
1272
- /* 30px */
1273
- /* 31px */
1274
- /* 32px */
1275
- /* 33px */
1276
- /* 34px */
1277
- /* 35px */
1278
- /* 36px */
1279
- /* 37px */
1280
- /* 38px */
1281
- /* 39px */
1282
- /* 40px */
1283
- /* 41px */
1284
- /* 42px */
1285
- /* 43px */
1286
- /* 44px */
1287
- /* 45px */
1288
- /* 46px */
1289
- /* 47px */
1290
- /* 48px */
1291
- /* 49px */
1292
- /* 50px */
1293
- /* 5em */
1294
- /* 65% */
1295
- /* border */
1296
- /* 0px */
1297
- /* 1px */
1298
- /* 1.5px */
1299
- /* 2px */
1300
- /* 3px */
1301
- /* 4px */
1302
- /* 5px */
1303
- /* 6px */
1304
- /* 7px */
1305
- /* 8px */
1306
- /* 9px */
1307
- /* 10px */
1308
- /* 11px */
1309
- /* 12px */
1310
- /* 13px */
1311
- /* 14px */
1312
- /* 15px */
1313
- /* 16px */
1314
-
1315
-
1316
-
1317
-
1318
- .e-ddl.e-control-wrapper .e-ddl-icon::before {
1319
- -webkit-transform: rotate(0deg);
1320
- transform: rotate(0deg);
1321
- -webkit-transition: -webkit-transform 300ms ease;
1322
- transition: -webkit-transform 300ms ease;
1323
- transition: transform 300ms ease;
1324
- transition: transform 300ms ease, -webkit-transform 300ms ease;
1325
- }
1326
-
1327
- .e-ddl.e-control-wrapper.e-icon-anim .e-ddl-icon::before {
1328
- -webkit-transform: rotate(180deg);
1329
- transform: rotate(180deg);
1330
- -webkit-transition: -webkit-transform 300ms ease;
1331
- transition: -webkit-transform 300ms ease;
1332
- transition: transform 300ms ease;
1333
- transition: transform 300ms ease, -webkit-transform 300ms ease;
1334
- }
1335
-
1336
- .e-dropdownbase .e-list-item.e-active.e-hover {
1337
- color: var(--color-sf-content-text-color-selected);
1338
- }
1339
-
1340
- .e-input-group:not(.e-disabled) .e-control.e-dropdownlist ~ .e-ddl-icon:active,
1341
- .e-input-group:not(.e-disabled) .e-control.e-dropdownlist ~ .e-ddl-icon:hover,
1342
- .e-input-group:not(.e-disabled) .e-back-icon:active,
1343
- .e-input-group:not(.e-disabled) .e-back-icon:hover,
1344
- .e-popup.e-ddl .e-input-group:not(.e-disabled) .e-clear-icon:active,
1345
- .e-popup.e-ddl .e-input-group:not(.e-disabled) .e-clear-icon:hover {
1346
- background: transparent;
1347
- }
1348
-
1349
- .e-input-group .e-ddl-icon:not(:active)::after {
1350
- -webkit-animation: none;
1351
- animation: none;
1352
- }
1353
-
1354
- .e-ddl.e-popup {
1355
- border: 0;
1356
- border-radius: calc(var(--e-radius) * 0.25);
1357
- -webkit-box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.14), 0 0 2px 0 rgba(0, 0, 0, 0.12);
1358
- box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.14), 0 0 2px 0 rgba(0, 0, 0, 0.12);
1359
- margin-top: 4px;
1360
- }
1361
-
1362
- .e-small .e-ddl.e-popup,
1363
- .e-small.e-ddl.e-popup {
1364
- border-radius: calc(var(--e-radius) * 0.25);
1365
- margin-top: 2px;
1366
- }
1367
-
1368
- .e-popup.e-ddl .e-dropdownbase {
1369
- min-height: 26px;
1370
- padding: 6px 4px;
1371
- }
1372
-
1373
- .e-input-group.e-ddl,
1374
- .e-input-group.e-ddl .e-input,
1375
- .e-input-group.e-ddl .e-ddl-icon {
1376
- background: var(--color-sf-content-bg-color);
1377
- }
1378
-
1379
- .e-ddl.e-ddl-device.e-ddl-device-filter .e-input-group:hover:not(.e-disabled):not(.e-float-icon-left),
1380
- .e-ddl.e-ddl-device.e-ddl-device-filter .e-input-group.e-control-wrapper:hover:not(.e-disabled):not(.e-float-icon-left) {
1381
- border-bottom-width: 0;
1382
- }
1383
-
1384
- .e-ddl.e-popup.e-outline .e-filter-parent {
1385
- padding: 4px 8px;
1386
- }
1387
-
1388
- .e-bigger .e-ddl.e-popup,
1389
- .e-bigger.e-ddl.e-popup {
1390
- border-radius: calc(var(--e-radius) * 0.5);
1391
- margin-top: 8px;
1392
- }
1393
-
1394
- .e-bigger.e-small .e-ddl.e-popup,
1395
- .e-small.e-bigger.e-ddl.e-popup {
1396
- border-radius: calc(var(--e-radius) * 0.5);
1397
- margin-top: 6px;
1398
- }
1399
-
1400
- .e-bigger .e-popup.e-ddl-device-filter .e-input-group.e-input-focus:not(.e-success):not(.e-warning):not(.e-error) {
1401
- border-color: var(--color-sf-border-light);
1402
- }
1403
-
1404
- .e-bigger .e-popup.e-ddl-device-filter {
1405
- margin-top: 0;
1406
- }
1407
-
1408
- .e-bigger .e-ddl-device .e-input-group,
1409
- .e-bigger .e-ddl-device .e-input-group.e-input-focus:not(.e-success):not(.e-warning):not(.e-error) {
1410
- background: var(--color-sf-flyout-bg-color);
1411
- border-width: 0;
1412
- -webkit-box-shadow: none;
1413
- box-shadow: none;
1414
- margin-bottom: 0;
1415
- }
1416
-
1417
- .e-bigger .e-ddl-device .e-input-group .e-back-icon,
1418
- .e-bigger .e-ddl-device .e-input-group input.e-input,
1419
- .e-bigger .e-ddl-device .e-input-group .e-clear-icon {
1420
- background-color: var(--color-sf-flyout-bg-color);
1421
- }
1422
-
1423
- .e-ddl.e-lib.e-input-group:not(.e-float-input) .e-dropdownlist:not(.e-input) {
1424
- width: 100%;
1425
- border: 0 solid;
1426
- }
1427
-
1428
- .e-popup.e-wide-popup.e-ddl-device.e-popup-close {
1429
- display: block;
1430
- visibility: hidden;
1431
- }
1432
-
1433
- .e-popup-full-page {
1434
- bottom: 0;
1435
- left: 0;
1436
- margin: 0;
1437
- overflow: hidden;
1438
- padding: 0;
1439
- right: 0;
1440
- top: 0;
1441
- }
1442
- .e-popup-full-page .e-popup-full-page.e-ddl.e-popup.e-ddl-device-filter {
1443
- margin: 0;
1444
- }
1445
-
1446
- .e-ddl.e-control-wrapper .e-ddl-disable-icon {
1447
- position: relative;
1448
- }
1449
-
1450
- .e-ddl.e-control-wrapper .e-ddl-disable-icon::before {
1451
- content: "";
1452
- }
1453
-
1454
- .e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon {
1455
- position: relative;
1456
- }
1250
+ .e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon {
1251
+ position: relative;
1252
+ }
1457
1253
 
1458
1254
  .e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon::before {
1459
1255
  content: "";
@@ -1650,19 +1446,6 @@ ejs-dropdownlist {
1650
1446
  width: 15px;
1651
1447
  }
1652
1448
 
1653
- /*! TreeView's theme wise override definitions and variables */
1654
- /* stylelint-disable */
1655
- /* stylelint-disable */
1656
- .e-ddt .e-ddt-icon::before {
1657
- content: "\e729";
1658
- padding: 3px;
1659
- }
1660
- .e-ddt .e-chips-close::before,
1661
- .e-ddt .e-clear-icon::before {
1662
- content: "\e7e7";
1663
- font-family: "e-icons";
1664
- }
1665
-
1666
1449
 
1667
1450
 
1668
1451
 
@@ -1749,40 +1532,135 @@ ejs-dropdownlist {
1749
1532
 
1750
1533
 
1751
1534
 
1752
- /* stylelint-disable */
1753
- .e-ddt .e-chips {
1754
- background-color: var(--color-sf-content-bg-color-alt2);
1535
+ .e-ddl.e-control-wrapper .e-ddl-icon::before {
1536
+ -webkit-transform: rotate(0deg);
1537
+ transform: rotate(0deg);
1538
+ -webkit-transition: -webkit-transform 300ms ease;
1539
+ transition: -webkit-transform 300ms ease;
1540
+ transition: transform 300ms ease;
1541
+ transition: transform 300ms ease, -webkit-transform 300ms ease;
1755
1542
  }
1756
- .e-ddt .e-chips .e-chips-close::before {
1757
- color: var(--color-sf-icon-color);
1543
+
1544
+ .e-ddl.e-control-wrapper.e-icon-anim .e-ddl-icon::before {
1545
+ -webkit-transform: rotate(180deg);
1546
+ transform: rotate(180deg);
1547
+ -webkit-transition: -webkit-transform 300ms ease;
1548
+ transition: -webkit-transform 300ms ease;
1549
+ transition: transform 300ms ease;
1550
+ transition: transform 300ms ease, -webkit-transform 300ms ease;
1758
1551
  }
1759
- .e-ddt .e-chips > .e-chipcontent {
1760
- color: var(--color-sf-content-text-color);
1552
+
1553
+ .e-dropdownbase .e-list-item.e-active.e-hover {
1554
+ color: var(--color-sf-content-text-color-selected);
1761
1555
  }
1762
- .e-ddt .e-overflow .e-remain {
1763
- color: var(--color-sf-content-text-color-alt3);
1556
+
1557
+ .e-input-group:not(.e-disabled) .e-control.e-dropdownlist ~ .e-ddl-icon:active,
1558
+ .e-input-group:not(.e-disabled) .e-control.e-dropdownlist ~ .e-ddl-icon:hover,
1559
+ .e-input-group:not(.e-disabled) .e-back-icon:active,
1560
+ .e-input-group:not(.e-disabled) .e-back-icon:hover,
1561
+ .e-popup.e-ddl .e-input-group:not(.e-disabled) .e-clear-icon:active,
1562
+ .e-popup.e-ddl .e-input-group:not(.e-disabled) .e-clear-icon:hover {
1563
+ background: transparent;
1764
1564
  }
1765
- .e-ddt.e-input-group.e-control-wrapper:focus, .e-ddt.e-float-input.e-control-wrapper:focus {
1766
- border-color: var(--color-sf-border-focus);
1565
+
1566
+ .e-input-group .e-ddl-icon:not(:active)::after {
1567
+ -webkit-animation: none;
1568
+ animation: none;
1767
1569
  }
1768
- .e-ddt.e-input-group.e-control-wrapper:active, .e-ddt.e-float-input.e-control-wrapper:active {
1769
- border-color: var(--color-sf-border-focus);
1570
+
1571
+ .e-ddl.e-popup {
1572
+ border: 0;
1573
+ border-radius: calc(var(--e-radius) * 0.25);
1574
+ -webkit-box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.14), 0 0 2px 0 rgba(0, 0, 0, 0.12);
1575
+ box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.14), 0 0 2px 0 rgba(0, 0, 0, 0.12);
1576
+ margin-top: 4px;
1770
1577
  }
1771
- .e-ddt.e-popup {
1578
+
1579
+ .e-small .e-ddl.e-popup,
1580
+ .e-small.e-ddl.e-popup {
1581
+ border-radius: calc(var(--e-radius) * 0.25);
1582
+ margin-top: 2px;
1583
+ }
1584
+
1585
+ .e-popup.e-ddl .e-dropdownbase {
1586
+ min-height: 26px;
1587
+ padding: 6px 4px;
1588
+ }
1589
+
1590
+ .e-input-group.e-ddl,
1591
+ .e-input-group.e-ddl .e-input,
1592
+ .e-input-group.e-ddl .e-ddl-icon {
1593
+ background: var(--color-sf-content-bg-color);
1594
+ }
1595
+
1596
+ .e-ddl.e-ddl-device.e-ddl-device-filter .e-input-group:hover:not(.e-disabled):not(.e-float-icon-left),
1597
+ .e-ddl.e-ddl-device.e-ddl-device-filter .e-input-group.e-control-wrapper:hover:not(.e-disabled):not(.e-float-icon-left) {
1598
+ border-bottom-width: 0;
1599
+ }
1600
+
1601
+ .e-ddl.e-popup.e-outline .e-filter-parent {
1602
+ padding: 4px 8px;
1603
+ }
1604
+
1605
+ .e-bigger .e-ddl.e-popup,
1606
+ .e-bigger.e-ddl.e-popup {
1607
+ border-radius: calc(var(--e-radius) * 0.5);
1608
+ margin-top: 8px;
1609
+ }
1610
+
1611
+ .e-bigger.e-small .e-ddl.e-popup,
1612
+ .e-small.e-bigger.e-ddl.e-popup {
1613
+ border-radius: calc(var(--e-radius) * 0.5);
1614
+ margin-top: 6px;
1615
+ }
1616
+
1617
+ .e-bigger .e-popup.e-ddl-device-filter .e-input-group.e-input-focus:not(.e-success):not(.e-warning):not(.e-error) {
1618
+ border-color: var(--color-sf-border-light);
1619
+ }
1620
+
1621
+ .e-bigger .e-popup.e-ddl-device-filter {
1622
+ margin-top: 0;
1623
+ }
1624
+
1625
+ .e-bigger .e-ddl-device .e-input-group,
1626
+ .e-bigger .e-ddl-device .e-input-group.e-input-focus:not(.e-success):not(.e-warning):not(.e-error) {
1772
1627
  background: var(--color-sf-flyout-bg-color);
1628
+ border-width: 0;
1629
+ -webkit-box-shadow: none;
1630
+ box-shadow: none;
1631
+ margin-bottom: 0;
1632
+ }
1633
+
1634
+ .e-bigger .e-ddl-device .e-input-group .e-back-icon,
1635
+ .e-bigger .e-ddl-device .e-input-group input.e-input,
1636
+ .e-bigger .e-ddl-device .e-input-group .e-clear-icon {
1637
+ background-color: var(--color-sf-flyout-bg-color);
1638
+ }
1639
+
1640
+ .e-popup {
1773
1641
  border-color: var(--color-sf-border-light);
1774
1642
  }
1775
- .e-ddt.e-popup .e-popup-content.e-no-data {
1776
- color: var(--color-sf-content-text-color);
1643
+
1644
+ .e-float-input.e-input-group.e-ddl.e-control.e-icon-anim > .e-float-text,
1645
+ .e-float-input.e-input-focus.e-input-group.e-ddl.e-control.e-keyboard > .e-float-text {
1646
+ color: var(--color-sf-content-text-color-selected);
1777
1647
  }
1778
- .e-ddt.e-popup .e-selectall-parent {
1779
- border-bottom-color: var(--color-sf-border-light);
1648
+
1649
+ .e-ddl.e-popup .e-filter-parent .e-input-group input.e-input-filter {
1650
+ border-color: transparent;
1780
1651
  }
1781
- .e-ddt.e-popup .e-selectall-parent:focus {
1782
- background: var(--color-sf-content-bg-color-hover);
1652
+
1653
+ /*! TreeView's theme wise override definitions and variables */
1654
+ /* stylelint-disable */
1655
+ /* stylelint-disable */
1656
+ .e-ddt .e-ddt-icon::before {
1657
+ content: "\e729";
1658
+ padding: 3px;
1783
1659
  }
1784
- .e-ddt.e-popup .e-selectall-parent .e-all-text {
1785
- color: var(--color-sf-content-text-color);
1660
+ .e-ddt .e-chips-close::before,
1661
+ .e-ddt .e-clear-icon::before {
1662
+ content: "\e7e7";
1663
+ font-family: "e-icons";
1786
1664
  }
1787
1665
 
1788
1666
 
@@ -2187,6 +2065,128 @@ ejs-dropdownlist {
2187
2065
  display: none;
2188
2066
  }
2189
2067
 
2068
+
2069
+
2070
+
2071
+
2072
+
2073
+
2074
+
2075
+
2076
+ /* Font Family */
2077
+ /* Font Sizes */
2078
+ /* Radius */
2079
+ /* 1px */
2080
+ /* 2px */
2081
+ /* 3px */
2082
+ /* 4px */
2083
+ /* 5px */
2084
+ /* 6px */
2085
+ /* 7px */
2086
+ /* 8px */
2087
+ /* 9px */
2088
+ /* 10px */
2089
+ /* 11px */
2090
+ /* 12px */
2091
+ /* 13px */
2092
+ /* 14px */
2093
+ /* 15px */
2094
+ /* 16px */
2095
+ /* 17px */
2096
+ /* 18px */
2097
+ /* 19px */
2098
+ /* 20px */
2099
+ /* 21px */
2100
+ /* 22px */
2101
+ /* 23px */
2102
+ /* 24px */
2103
+ /* 25px */
2104
+ /* 26px */
2105
+ /* 27px */
2106
+ /* 28px */
2107
+ /* 29px */
2108
+ /* 30px */
2109
+ /* 31px */
2110
+ /* 32px */
2111
+ /* 33px */
2112
+ /* 34px */
2113
+ /* 35px */
2114
+ /* 36px */
2115
+ /* 37px */
2116
+ /* 38px */
2117
+ /* 39px */
2118
+ /* 40px */
2119
+ /* 41px */
2120
+ /* 42px */
2121
+ /* 43px */
2122
+ /* 44px */
2123
+ /* 45px */
2124
+ /* 46px */
2125
+ /* 47px */
2126
+ /* 48px */
2127
+ /* 49px */
2128
+ /* 50px */
2129
+ /* 5em */
2130
+ /* 65% */
2131
+ /* border */
2132
+ /* 0px */
2133
+ /* 1px */
2134
+ /* 1.5px */
2135
+ /* 2px */
2136
+ /* 3px */
2137
+ /* 4px */
2138
+ /* 5px */
2139
+ /* 6px */
2140
+ /* 7px */
2141
+ /* 8px */
2142
+ /* 9px */
2143
+ /* 10px */
2144
+ /* 11px */
2145
+ /* 12px */
2146
+ /* 13px */
2147
+ /* 14px */
2148
+ /* 15px */
2149
+ /* 16px */
2150
+
2151
+
2152
+
2153
+
2154
+ /* stylelint-disable */
2155
+ .e-ddt .e-chips {
2156
+ background-color: var(--color-sf-content-bg-color-alt2);
2157
+ }
2158
+ .e-ddt .e-chips .e-chips-close::before {
2159
+ color: var(--color-sf-icon-color);
2160
+ }
2161
+ .e-ddt .e-chips > .e-chipcontent {
2162
+ color: var(--color-sf-content-text-color);
2163
+ }
2164
+ .e-ddt .e-overflow .e-remain {
2165
+ color: var(--color-sf-content-text-color-alt3);
2166
+ }
2167
+ .e-ddt.e-input-group.e-control-wrapper:focus, .e-ddt.e-float-input.e-control-wrapper:focus {
2168
+ border-color: var(--color-sf-border-focus);
2169
+ }
2170
+ .e-ddt.e-input-group.e-control-wrapper:active, .e-ddt.e-float-input.e-control-wrapper:active {
2171
+ border-color: var(--color-sf-border-focus);
2172
+ }
2173
+ .e-ddt.e-popup {
2174
+ background: var(--color-sf-flyout-bg-color);
2175
+ border-color: var(--color-sf-border-light);
2176
+ }
2177
+ .e-ddt.e-popup .e-popup-content.e-no-data {
2178
+ color: var(--color-sf-content-text-color);
2179
+ }
2180
+ .e-ddt.e-popup .e-selectall-parent {
2181
+ border-bottom-color: var(--color-sf-border-light);
2182
+ }
2183
+ .e-ddt.e-popup .e-selectall-parent:focus {
2184
+ background: var(--color-sf-content-bg-color-hover);
2185
+ }
2186
+ .e-ddt.e-popup .e-selectall-parent .e-all-text {
2187
+ color: var(--color-sf-content-text-color);
2188
+ }
2189
+
2190
2190
  /* stylelint-disable-line no-empty-source */
2191
2191
  /* stylelint-disable-line no-empty-source */
2192
2192
  .e-multi-select-wrapper .e-chips-collection .e-chips .e-chips-close.e-icon::before {
@@ -2457,19 +2457,136 @@ ejs-dropdownlist {
2457
2457
 
2458
2458
 
2459
2459
 
2460
- .e-multi-select-wrapper .e-chips-collection .e-chips .e-chips-close.e-icon::before {
2461
- line-height: 30px;
2462
- top: 0;
2460
+ .e-dropdownbase .e-list-item.e-active,
2461
+ .e-dropdownbase .e-list-item.e-active.e-hover {
2462
+ font-weight: 400;
2463
2463
  }
2464
2464
 
2465
- .e-multiselect .e-input-group-icon.e-ddl-icon {
2466
- border-radius: calc(var(--e-radius) * 0) calc(var(--e-radius) * 0.25) calc(var(--e-radius) * 0.25) calc(var(--e-radius) * 0);
2467
- border-right-width: 0;
2465
+ .e-dropdownbase .e-list-group-item,
2466
+ .e-fixed-head {
2467
+ font-size: 12px;
2468
+ text-transform: uppercase;
2468
2469
  }
2469
2470
 
2470
- .e-multiselect.e-rtl .e-input-group-icon.e-ddl-icon {
2471
- border-left-width: 0;
2472
- border-radius: calc(var(--e-radius) * 0.25) calc(var(--e-radius) * 0) calc(var(--e-radius) * 0) calc(var(--e-radius) * 0.25);
2471
+ .e-small .e-dropdownbase .e-list-group-item,
2472
+ .e-small .e-fixed-head,
2473
+ .e-small.e-dropdownbase .e-list-group-item,
2474
+ .e-small.e-fixed-head {
2475
+ font-size: 10px;
2476
+ }
2477
+
2478
+ .e-dropdownbase .e-list-item .e-list-icon {
2479
+ padding: 0 8px 0 0;
2480
+ }
2481
+
2482
+ .e-small .e-dropdownbase .e-list-item .e-list-icon {
2483
+ padding: 0 4px 0 0;
2484
+ }
2485
+
2486
+ /* stylelint-disable */
2487
+ .e-dropdownbase .e-list-item {
2488
+ border-radius: calc(var(--e-radius) * 0.375) !important;
2489
+ }
2490
+
2491
+
2492
+
2493
+
2494
+
2495
+
2496
+
2497
+
2498
+
2499
+ /* Font Family */
2500
+ /* Font Sizes */
2501
+ /* Radius */
2502
+ /* 1px */
2503
+ /* 2px */
2504
+ /* 3px */
2505
+ /* 4px */
2506
+ /* 5px */
2507
+ /* 6px */
2508
+ /* 7px */
2509
+ /* 8px */
2510
+ /* 9px */
2511
+ /* 10px */
2512
+ /* 11px */
2513
+ /* 12px */
2514
+ /* 13px */
2515
+ /* 14px */
2516
+ /* 15px */
2517
+ /* 16px */
2518
+ /* 17px */
2519
+ /* 18px */
2520
+ /* 19px */
2521
+ /* 20px */
2522
+ /* 21px */
2523
+ /* 22px */
2524
+ /* 23px */
2525
+ /* 24px */
2526
+ /* 25px */
2527
+ /* 26px */
2528
+ /* 27px */
2529
+ /* 28px */
2530
+ /* 29px */
2531
+ /* 30px */
2532
+ /* 31px */
2533
+ /* 32px */
2534
+ /* 33px */
2535
+ /* 34px */
2536
+ /* 35px */
2537
+ /* 36px */
2538
+ /* 37px */
2539
+ /* 38px */
2540
+ /* 39px */
2541
+ /* 40px */
2542
+ /* 41px */
2543
+ /* 42px */
2544
+ /* 43px */
2545
+ /* 44px */
2546
+ /* 45px */
2547
+ /* 46px */
2548
+ /* 47px */
2549
+ /* 48px */
2550
+ /* 49px */
2551
+ /* 50px */
2552
+ /* 5em */
2553
+ /* 65% */
2554
+ /* border */
2555
+ /* 0px */
2556
+ /* 1px */
2557
+ /* 1.5px */
2558
+ /* 2px */
2559
+ /* 3px */
2560
+ /* 4px */
2561
+ /* 5px */
2562
+ /* 6px */
2563
+ /* 7px */
2564
+ /* 8px */
2565
+ /* 9px */
2566
+ /* 10px */
2567
+ /* 11px */
2568
+ /* 12px */
2569
+ /* 13px */
2570
+ /* 14px */
2571
+ /* 15px */
2572
+ /* 16px */
2573
+
2574
+
2575
+
2576
+
2577
+ .e-multi-select-wrapper .e-chips-collection .e-chips .e-chips-close.e-icon::before {
2578
+ line-height: 30px;
2579
+ top: 0;
2580
+ }
2581
+
2582
+ .e-multiselect .e-input-group-icon.e-ddl-icon {
2583
+ border-radius: calc(var(--e-radius) * 0) calc(var(--e-radius) * 0.25) calc(var(--e-radius) * 0.25) calc(var(--e-radius) * 0);
2584
+ border-right-width: 0;
2585
+ }
2586
+
2587
+ .e-multiselect.e-rtl .e-input-group-icon.e-ddl-icon {
2588
+ border-left-width: 0;
2589
+ border-radius: calc(var(--e-radius) * 0.25) calc(var(--e-radius) * 0) calc(var(--e-radius) * 0) calc(var(--e-radius) * 0.25);
2473
2590
  border-right-width: 0;
2474
2591
  }
2475
2592
 
@@ -2569,341 +2686,773 @@ ejs-dropdownlist {
2569
2686
  width: 20px;
2570
2687
  }
2571
2688
 
2572
- .e-multi-select-wrapper .e-chips.e-chip-selected .e-chips-close::before {
2573
- color: var(--color-sf-content-text-color);
2574
- }
2575
-
2576
- .e-multi-select-wrapper .e-chips.e-chip-selected {
2577
- background-color: var(--color-sf-content-bg-color-alt5);
2578
- }
2579
-
2580
- .e-multiselect:not(.e-disabled) .e-multi-select-wrapper .e-chips.e-chip-selected:hover {
2581
- background-color: var(--color-sf-content-bg-color-alt5);
2582
- }
2583
-
2584
- .e-multiselect {
2689
+ .e-multi-select-wrapper {
2585
2690
  -webkit-box-sizing: border-box;
2586
2691
  box-sizing: border-box;
2692
+ cursor: text;
2693
+ line-height: normal;
2694
+ min-height: 28px;
2695
+ padding: 1px 32px 1px 0;
2696
+ position: relative;
2697
+ -webkit-user-select: none;
2698
+ -moz-user-select: none;
2699
+ -ms-user-select: none;
2700
+ user-select: none;
2701
+ width: 100%;
2587
2702
  }
2588
-
2589
- /* stylelint-disable property-no-vendor-prefix */
2590
- .e-multi-select-wrapper .e-chips > .e-chipcontent {
2591
- -webkit-text-fill-color: var(--color-sf-content-text-color);
2592
- color: var(--color-sf-content-text-color);
2593
- font-family: var(--e-font-family);
2594
- font-size: 14px;
2595
- }
2596
-
2597
- .e-multi-select-wrapper .e-chips.e-chip-selected > .e-chipcontent {
2598
- color: var(--color-sf-content-text-color);
2599
- }
2600
-
2601
- .e-multi-select-wrapper .e-chips.e-chip-selected > .e-chipcontent:hover {
2602
- color: var(--color-sf-content-text-color-hover);
2703
+ .e-multi-select-wrapper.e-delimiter .e-searcher, .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
2704
+ height: 27px;
2705
+ vertical-align: middle;
2603
2706
  }
2604
-
2605
- .e-multi-select-wrapper .e-chips {
2606
- background-color: var(--color-sf-chip-bg-color);
2607
- border: 1px solid var(--color-sf-chip-border-color);
2608
- border-radius: calc(var(--e-radius) * 0.375);
2609
- height: 22px;
2707
+ .e-multi-select-wrapper.e-delimiter .e-searcher .e-dropdownbase, .e-multi-select-wrapper.e-delimiter .e-multi-searcher .e-dropdownbase {
2708
+ height: 100%;
2709
+ min-height: 100%;
2610
2710
  }
2611
-
2612
- .e-multiselect:not(.e-disabled) .e-multi-select-wrapper .e-chips:hover {
2613
- background-color: var(--color-sf-content-bg-color-alt4);
2711
+ .e-multi-select-wrapper .e-delim-view {
2712
+ white-space: nowrap;
2614
2713
  }
2615
-
2616
- .e-multi-select-wrapper .e-chips > .e-chipcontent:hover {
2617
- color: var(--color-sf-content-text-color-hover);
2714
+ .e-multi-select-wrapper .e-delim-view.e-delim-values.e-delim-overflow, .e-multi-select-wrapper .e-delim-view.e-delim-values.e-delim-total {
2715
+ -webkit-box-sizing: border-box;
2716
+ box-sizing: border-box;
2717
+ display: inline-block;
2718
+ overflow: hidden;
2719
+ text-overflow: ellipsis;
2618
2720
  }
2619
-
2620
- .e-multi-select-wrapper .e-chips .e-chips-close::before {
2621
- -webkit-text-fill-color: var(--color-sf-icon-color);
2622
- color: var(--color-sf-icon-color);
2721
+ .e-multi-select-wrapper .e-chips.e-mob-chip.e-chip-selected .e-chips-close::before {
2722
+ color: var(--color-sf-content-text-color);
2623
2723
  font-size: 16px;
2724
+ left: 12px;
2725
+ top: 0;
2624
2726
  }
2625
-
2626
- .e-multi-select-wrapper .e-chips.e-mob-chip.e-chip-selected {
2727
+ .e-multi-select-wrapper .e-chips.e-mob-chip.e-chip-selected .e-chipcontent {
2627
2728
  background-color: var(--color-sf-primary);
2628
- border-radius: calc(var(--e-radius) * 0.375);
2629
2729
  color: var(--color-sf-content-text-color);
2630
- height: 40px;
2631
- line-height: 40px;
2730
+ padding: 12px 4px 11px 0;
2632
2731
  }
2633
-
2634
- .e-multi-select-wrapper .e-chips.e-mob-chip.e-chip-selected .e-chipcontent {
2635
- color: var(--color-sf-content-text-color);
2732
+ .e-multi-select-wrapper .e-searcher.e-zero-size:not(.e-multiselect-box),
2733
+ .e-multi-select-wrapper .e-multi-searcher.e-zero-size:not(.e-multiselect-box) {
2734
+ width: 0;
2636
2735
  }
2637
-
2638
- .e-multi-select-wrapper .e-chips.e-mob-chip {
2639
- height: 30px;
2736
+ .e-multi-select-wrapper .e-searcher.e-zero-size:not(.e-multiselect-box) input[type=text],
2737
+ .e-multi-select-wrapper .e-multi-searcher.e-zero-size:not(.e-multiselect-box) input[type=text] {
2738
+ height: 1px;
2739
+ min-height: 1px;
2640
2740
  }
2641
-
2642
- .e-popup.e-multi-select-list-wrapper {
2643
- -webkit-box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.14), 0 0 2px 0 rgba(0, 0, 0, 0.12);
2644
- box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.14), 0 0 2px 0 rgba(0, 0, 0, 0.12);
2645
- -webkit-box-sizing: content-box;
2646
- box-sizing: content-box;
2647
- overflow: initial;
2741
+ .e-multi-select-wrapper .e-chips.e-mob-chip > .e-chipcontent {
2742
+ max-width: 100%;
2648
2743
  }
2649
2744
 
2650
- .e-popup.e-multi-select-list-wrapper .e-list-item.e-active {
2651
- border-bottom: 1px solid transparent;
2652
- border-left: 1px solid var(--color-sf-content-bg-color-selected);
2653
- border-right: 1px solid var(--color-sf-content-bg-color-selected);
2654
- border-top: 1px solid var(--color-sf-border-selected);
2745
+ .e-multiselect.e-control-container .e-multi-select-wrapper .e-multi-searcher,
2746
+ .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-multi-searcher {
2747
+ display: -webkit-box;
2748
+ display: -ms-flexbox;
2749
+ display: flex;
2750
+ float: left;
2751
+ width: auto;
2655
2752
  }
2656
-
2657
- .e-popup.e-multi-select-list-wrapper.e-checkbox .e-list-item.e-active {
2658
- background-color: transparent;
2659
- border-color: transparent;
2660
- color: var(--color-sf-content-text-color);
2753
+ .e-multiselect.e-control-container .e-multi-select-wrapper.e-delimiter .e-multi-searcher,
2754
+ .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
2755
+ display: -webkit-inline-box;
2756
+ display: -ms-inline-flexbox;
2757
+ display: inline-flex;
2758
+ float: none;
2661
2759
  }
2662
-
2663
- .e-popup.e-multi-select-list-wrapper.e-multiselect-group.e-checkbox .e-list-group-item.e-active {
2664
- background-color: transparent;
2665
- border-color: transparent;
2666
- color: var(--color-sf-content-text-color);
2760
+ .e-multiselect.e-control-container .e-multi-select-wrapper .e-multi-searcher.e-zero-size:not(.e-multiselect-box),
2761
+ .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-multi-searcher.e-zero-size:not(.e-multiselect-box) {
2762
+ width: 0;
2667
2763
  }
2668
-
2669
- .e-popup.e-multi-select-list-wrapper.e-checkbox .e-list-item.e-active.e-item-focus {
2670
- color: var(--color-sf-content-text-color);
2671
- color: var(--color-sf-flyout-text-color-selected);
2764
+ .e-multiselect.e-control-container .e-multi-select-wrapper .e-delim-values.e-delim-hide,
2765
+ .e-multiselect.e-control-container .e-multi-select-wrapper .e-delim-view.e-delim-values.e-delim-hide,
2766
+ .e-multiselect.e-control-container .e-multi-select-wrapper .e-chips-collection.e-delim-hide,
2767
+ .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-delim-values.e-delim-hide,
2768
+ .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-delim-view.e-delim-values.e-delim-hide,
2769
+ .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-chips-collection.e-delim-hide {
2770
+ display: none;
2672
2771
  }
2673
-
2674
- .e-popup.e-multi-select-list-wrapper.e-multiselect-group.e-checkbox .e-list-group-item.e-active.e-item-focus {
2675
- color: var(--color-sf-content-text-color);
2772
+ .e-multiselect.e-control-container .e-multi-select-wrapper .e-delim-values,
2773
+ .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-delim-values {
2774
+ -webkit-box-align: center;
2775
+ -ms-flex-align: center;
2776
+ align-items: center;
2777
+ display: inline;
2778
+ max-width: 100%;
2779
+ word-break: break-word;
2780
+ }
2781
+ .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
2782
+ .e-multiselect.e-control-container .e-multi-select-wrapper .e-ddl-icon,
2783
+ .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-clear-icon,
2784
+ .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-ddl-icon {
2785
+ -webkit-box-align: center;
2786
+ -ms-flex-align: center;
2787
+ align-items: center;
2788
+ cursor: pointer;
2789
+ display: none;
2790
+ -webkit-box-orient: horizontal;
2791
+ -webkit-box-direction: normal;
2792
+ -ms-flex-direction: row;
2793
+ flex-direction: row;
2794
+ margin-top: -2em;
2795
+ outline: 0;
2796
+ padding: 0;
2797
+ position: absolute;
2798
+ right: 5px;
2799
+ top: 100%;
2800
+ }
2801
+ .e-multiselect.e-control-container :not(.e-disabled).e-multi-select-wrapper:hover .e-clear-icon,
2802
+ .e-multiselect.e-control-container .e-multi-select-wrapper .e-ddl-icon,
2803
+ .e-multiselect.e-control-container.e-input-group :not(.e-disabled).e-multi-select-wrapper:hover .e-clear-icon,
2804
+ .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-ddl-icon {
2805
+ display: -webkit-box;
2806
+ display: -ms-flexbox;
2807
+ display: flex;
2808
+ }
2809
+ .e-multiselect.e-control-container .e-multi-select-wrapper .e-ddl-icon,
2810
+ .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-ddl-icon {
2811
+ margin-right: 0;
2812
+ margin-top: -2.3em;
2813
+ right: 0;
2814
+ padding: 9px;
2815
+ }
2816
+ .e-multiselect.e-control-container .e-multi-select-wrapper.e-delimiter,
2817
+ .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper.e-delimiter {
2818
+ top: -1px;
2819
+ }
2820
+ .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
2821
+ .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-clear-icon {
2822
+ font-size: 14px;
2823
+ height: 28px;
2824
+ width: 28px;
2676
2825
  }
2677
2826
 
2678
- .e-popup.e-multi-select-list-wrapper.e-checkbox .e-list-item.e-active.e-hover {
2679
- background-color: var(--color-sf-content-bg-color-hover);
2680
- color: var(--color-sf-flyout-text-color-focus);
2827
+ .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-multi-searcher,
2828
+ .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-multi-searcher {
2829
+ float: right;
2830
+ }
2831
+ .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher,
2832
+ .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
2833
+ float: none;
2834
+ }
2835
+ .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-clear-icon,
2836
+ .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-ddl-icon,
2837
+ .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-clear-icon,
2838
+ .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-ddl-icon {
2839
+ left: 0;
2840
+ right: auto;
2841
+ }
2842
+ .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper.e-down-icon,
2843
+ .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper.e-down-icon {
2844
+ padding: 0 0 0 48px;
2681
2845
  }
2682
2846
 
2683
- .e-popup.e-multi-select-list-wrapper.e-multiselect-group.e-checkbox .e-list-group-item.e-active.e-hover {
2684
- background-color: var(--color-sf-content-bg-color-hover);
2847
+ .e-popup.e-multi-select-list-wrapper .e-list-item.e-disabled,
2848
+ .e-popup.e-multi-select-list-wrapper.e-multiselect-group.e-checkbox .e-list-group-item.e-disabled {
2849
+ opacity: 0.7;
2850
+ pointer-events: none;
2685
2851
  }
2686
2852
 
2687
- .e-popup.e-multi-select-list-wrapper .e-list-item.e-active:first-child {
2688
- border-bottom: 1px solid transparent;
2689
- border-top: 1px solid transparent;
2853
+ .e-multiselect.e-input-group,
2854
+ .e-multiselect.e-float-input {
2855
+ word-wrap: initial;
2690
2856
  }
2691
2857
 
2692
- .e-popup.e-multi-select-list-wrapper .e-list-item.e-active:last-child {
2693
- border-bottom: 1px solid transparent;
2858
+ .e-multiselect.e-input-group .e-searcher .e-label-top,
2859
+ .e-multiselect.e-input-group .e-multi-searcher .e-label-top {
2860
+ top: 15px;
2694
2861
  }
2695
2862
 
2696
- .e-popup.e-multi-select-list-wrapper .e-list-item.e-active.e-item-focus + li.e-active {
2697
- border-top: 1px solid transparent;
2863
+ .e-multi-select-wrapper.e-close-icon-hide {
2864
+ padding-right: 0;
2698
2865
  }
2699
2866
 
2700
- .e-popup.e-multi-select-list-wrapper .e-list-item.e-active.e-item-focus {
2701
- background-color: var(--color-sf-content-bg-color-selected);
2702
- -webkit-box-shadow: none;
2703
- box-shadow: none;
2704
- color: var(--color-sf-content-text-color-selected);
2705
- border: 1px solid transparent;
2867
+ .e-multi-select-wrapper .e-chips-collection {
2868
+ cursor: default;
2869
+ display: block;
2706
2870
  }
2707
2871
 
2708
- .e-popup.e-multi-select-list-wrapper.e-multiselect-group .e-list-group-item.e-active.e-item-focus {
2709
- background-color: var(--color-sf-content-bg-color-selected);
2710
- -webkit-box-shadow: none;
2711
- box-shadow: none;
2712
- color: var(--color-sf-content-text-color-selected);
2713
- border: 1px solid transparent;
2872
+ .e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
2873
+ margin-right: 30px;
2714
2874
  }
2715
2875
 
2716
- .e-popup.e-multi-select-list-wrapper .e-list-item {
2717
- border: 0 solid transparent;
2876
+ .e-multi-select-wrapper .e-multi-hidden {
2877
+ border: 0;
2878
+ height: 0;
2879
+ position: absolute;
2880
+ visibility: hidden;
2881
+ width: 0;
2718
2882
  }
2719
2883
 
2720
- .e-popup.e-multi-select-list-wrapper.e-multiselect-group .e-list-group-item {
2721
- border: 0 solid transparent;
2884
+ .e-multi-select-wrapper .e-chips {
2885
+ -webkit-box-align: center;
2886
+ -ms-flex-align: center;
2887
+ align-items: center;
2888
+ display: -webkit-inline-box;
2889
+ display: -ms-inline-flexbox;
2890
+ display: inline-flex;
2891
+ float: left;
2892
+ margin: 3px;
2893
+ max-width: 100%;
2894
+ overflow: hidden;
2895
+ padding: 0 4px 0 8px;
2896
+ text-overflow: ellipsis;
2897
+ white-space: nowrap;
2722
2898
  }
2723
2899
 
2724
- .e-multi-select-wrapper input.e-dropdownbase:-moz-placeholder { /* stylelint-disable-line selector-no-vendor-prefix */
2725
- color: var(--color-sf-placeholder-text-color);
2900
+ .e-multi-select-wrapper .e-chips > .e-chipcontent {
2901
+ max-width: 100%;
2902
+ overflow: hidden;
2903
+ padding: 0 4px 0 0;
2904
+ text-indent: 0;
2905
+ text-overflow: ellipsis;
2906
+ white-space: nowrap;
2726
2907
  }
2727
2908
 
2728
- .e-multi-select-wrapper input.e-dropdownbase::-moz-placeholder { /* stylelint-disable-line selector-no-vendor-prefix */
2729
- color: var(--color-sf-placeholder-text-color);
2909
+ .e-multi-select-wrapper.e-delimiter .e-searcher {
2910
+ display: inline-block;
2911
+ float: none;
2730
2912
  }
2731
2913
 
2732
- .e-multi-select-wrapper input.e-dropdownbase:-ms-input-placeholder { /* stylelint-disable-line selector-no-vendor-prefix */
2733
- color: var(--color-sf-placeholder-text-color);
2914
+ .e-multi-select-wrapper .e-mob-chip.e-chips > .e-chipcontent {
2915
+ padding: 8px 4px 8px 0;
2734
2916
  }
2735
2917
 
2736
- .e-multi-select-wrapper input.e-dropdownbase::-webkit-input-placeholder { /* stylelint-disable-line selector-no-vendor-prefix */
2737
- color: var(--color-sf-placeholder-text-color);
2918
+ .e-multiselect.e-rtl .e-multi-select-wrapper .e-mob-chip.e-chips > .e-chipcontent {
2919
+ padding: 8px 0 8px 4px;
2738
2920
  }
2739
2921
 
2740
- .e-ul.e-reorder {
2741
- border-bottom: 1px solid var(--color-sf-border-light);
2922
+ .e-multi-select-wrapper .e-chips-close {
2923
+ -ms-flex-item-align: center;
2924
+ align-self: center;
2925
+ display: -webkit-box;
2926
+ display: -ms-flexbox;
2927
+ display: flex;
2928
+ float: right;
2929
+ font-family: "e-icons";
2930
+ height: 16px;
2931
+ margin: 0 0 0;
2932
+ width: 16px;
2742
2933
  }
2743
2934
 
2744
- .e-multi-select-list-wrapper .e-selectall-parent {
2745
- border-bottom: 1px solid var(--color-sf-border-light);
2935
+ .e-rtl .e-multi-select-wrapper .e-chips-close {
2936
+ margin: 0 0 0;
2746
2937
  }
2747
2938
 
2748
- .e-multi-select-wrapper .e-delim-values {
2749
- -webkit-text-fill-color: var(--color-sf-content-text-color);
2750
- color: var(--color-sf-content-text-color);
2939
+ .e-multi-select-wrapper .e-mob-chip.e-chips .e-chips-close {
2940
+ margin: 3px 0 0;
2751
2941
  }
2752
2942
 
2753
2943
  .e-multi-select-wrapper .e-chips-close.e-close-hooker {
2754
- color: var(--color-sf-icon-color);
2944
+ cursor: default;
2945
+ font-size: 14px;
2946
+ height: 28px;
2947
+ margin-top: -2em;
2948
+ position: absolute;
2949
+ right: 5px;
2950
+ width: 28px;
2951
+ top: 100%;
2755
2952
  }
2756
2953
 
2757
- .e-small .e-multi-select-wrapper .e-chips {
2758
- height: 18px;
2954
+ .e-multiselect .e-down-icon .e-chips-close.e-close-hooker,
2955
+ .e-small.e-multiselect .e-down-icon .e-chips-close.e-close-hooker,
2956
+ .e-multiselect.e-input-group.e-control-container .e-multi-select-wrapper.e-down-icon .e-clear-icon {
2957
+ right: 32px;
2759
2958
  }
2760
2959
 
2761
- .e-small .e-multi-select-wrapper .e-chips > .e-chipcontent {
2762
- font-size: 12px;
2960
+ .e-multiselect.e-input-group.e-control-container.e-rtl .e-multi-select-wrapper.e-down-icon .e-clear-icon {
2961
+ left: 32px;
2962
+ right: auto;
2763
2963
  }
2764
2964
 
2765
- .e-small .e-multi-select-wrapper .e-chips .e-chips-close::before {
2965
+ .e-multi-select-wrapper input[type=text] {
2966
+ background: none;
2967
+ border: 0;
2968
+ font-family: var(--e-font-family);
2766
2969
  font-size: 14px;
2970
+ font-weight: normal;
2971
+ height: 28px;
2972
+ min-height: 28px;
2973
+ outline: none;
2974
+ padding: 4px 0 4px 12px;
2975
+ text-indent: 0;
2767
2976
  }
2768
2977
 
2769
- .e-small .e-multi-select-wrapper .e-close-hooker::before {
2770
- left: 6px;
2978
+ .e-multiselect.e-filled .e-multi-select-wrapper input[type=text] {
2979
+ background: none;
2980
+ border: 0;
2981
+ color: inherit;
2982
+ font-family: var(--e-font-family);
2983
+ font-size: 14px;
2984
+ font-weight: normal;
2985
+ height: 28px;
2986
+ min-height: 28px;
2987
+ outline: none;
2988
+ padding: 0;
2989
+ text-indent: 10px;
2771
2990
  }
2772
2991
 
2773
- .e-multiselect.e-disabled .e-multi-select-wrapper .e-delim-values {
2774
- -webkit-text-fill-color: var(--color-sf-content-text-color-disabled);
2775
- color: var(--color-sf-content-text-color-disabled);
2992
+ .e-rtl.e-multiselect.e-filled .e-multi-select-wrapper input[type=text] {
2993
+ padding: 5px;
2776
2994
  }
2777
2995
 
2996
+ /* stylelint-disable property-no-vendor-prefix */
2997
+ .e-multi-select-wrapper input[type=text]::-ms-clear {
2998
+ display: none;
2999
+ }
2778
3000
 
3001
+ .e-multi-select-wrapper .e-searcher {
3002
+ display: block;
3003
+ float: left;
3004
+ width: auto;
3005
+ }
2779
3006
 
3007
+ .e-multiselect .e-multi-select-wrapper.e-down-icon .e-searcher.e-search-custom-width {
3008
+ width: calc(100% - 32px);
3009
+ }
2780
3010
 
3011
+ .e-small .e-multiselect .e-multi-select-wrapper.e-down-icon .e-searcher.e-search-custom-width,
3012
+ .e-small.e-multiselect .e-multi-select-wrapper.e-down-icon .e-searcher.e-search-custom-width {
3013
+ width: calc(100% - 30px);
3014
+ }
2781
3015
 
3016
+ .e-multi-select-wrapper .e-delim-values {
3017
+ font-family: var(--e-font-family);
3018
+ font-size: 14px;
3019
+ line-height: 28px;
3020
+ max-width: 100%;
3021
+ padding-left: 10px;
3022
+ padding-right: 6px;
3023
+ vertical-align: middle;
3024
+ }
2782
3025
 
3026
+ .e-multi-select-list-wrapper .e-hide-listitem,
3027
+ .e-multi-select-list-wrapper .e-hide-group-header {
3028
+ display: none;
3029
+ }
2783
3030
 
3031
+ .e-multi-select-wrapper .e-delim-values .e-remain {
3032
+ color: var(--color-sf-content-text-color);
3033
+ cursor: pointer;
3034
+ display: inline-block;
3035
+ font-size: 14px;
3036
+ padding-left: 16px;
3037
+ }
2784
3038
 
3039
+ .e-multiselect.e-disabled .e-multi-select-wrapper,
3040
+ .e-multiselect.e-disabled .e-multi-select-wrapper .e-chips .e-chips-close::before {
3041
+ cursor: not-allowed;
3042
+ }
2785
3043
 
2786
- /* Font Family */
2787
- /* Font Sizes */
2788
- /* Radius */
2789
- /* 1px */
2790
- /* 2px */
2791
- /* 3px */
2792
- /* 4px */
2793
- /* 5px */
2794
- /* 6px */
2795
- /* 7px */
2796
- /* 8px */
2797
- /* 9px */
2798
- /* 10px */
2799
- /* 11px */
2800
- /* 12px */
2801
- /* 13px */
2802
- /* 14px */
2803
- /* 15px */
2804
- /* 16px */
2805
- /* 17px */
2806
- /* 18px */
2807
- /* 19px */
2808
- /* 20px */
2809
- /* 21px */
2810
- /* 22px */
2811
- /* 23px */
2812
- /* 24px */
2813
- /* 25px */
2814
- /* 26px */
2815
- /* 27px */
2816
- /* 28px */
2817
- /* 29px */
2818
- /* 30px */
2819
- /* 31px */
2820
- /* 32px */
2821
- /* 33px */
2822
- /* 34px */
2823
- /* 35px */
2824
- /* 36px */
2825
- /* 37px */
2826
- /* 38px */
2827
- /* 39px */
2828
- /* 40px */
2829
- /* 41px */
2830
- /* 42px */
2831
- /* 43px */
2832
- /* 44px */
2833
- /* 45px */
2834
- /* 46px */
2835
- /* 47px */
2836
- /* 48px */
2837
- /* 49px */
2838
- /* 50px */
2839
- /* 5em */
2840
- /* 65% */
2841
- /* border */
2842
- /* 0px */
2843
- /* 1px */
2844
- /* 1.5px */
2845
- /* 2px */
2846
- /* 3px */
2847
- /* 4px */
2848
- /* 5px */
2849
- /* 6px */
2850
- /* 7px */
2851
- /* 8px */
2852
- /* 9px */
2853
- /* 10px */
2854
- /* 11px */
2855
- /* 12px */
2856
- /* 13px */
2857
- /* 14px */
2858
- /* 15px */
2859
- /* 16px */
3044
+ .e-multi-select-wrapper .e-chips.e-mob-chip.e-chip-selected .e-chips-close {
3045
+ height: 40px;
3046
+ left: 0;
3047
+ margin: 0 0 0 0;
3048
+ margin-left: auto;
3049
+ position: relative;
3050
+ top: 0;
3051
+ width: 40px;
3052
+ }
2860
3053
 
3054
+ .e-multi-select-wrapper .e-chips.e-mob-chip.e-chip-selected {
3055
+ -ms-flex-item-align: center;
3056
+ align-self: center;
3057
+ -webkit-box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.21);
3058
+ box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.21);
3059
+ display: -webkit-inline-box;
3060
+ display: -ms-inline-flexbox;
3061
+ display: inline-flex;
3062
+ padding: 0 0 0 16px;
3063
+ width: 92%;
3064
+ }
2861
3065
 
3066
+ .e-multi-select-wrapper .e-ddl-disable-icon::before {
3067
+ content: "";
3068
+ }
2862
3069
 
3070
+ .e-multiselect.e-rtl .e-multi-select-wrapper.e-delimiter .e-searcher {
3071
+ float: none;
3072
+ }
2863
3073
 
2864
- .e-dropdownbase .e-list-item.e-active,
2865
- .e-dropdownbase .e-list-item.e-active.e-hover {
2866
- font-weight: 400;
3074
+ .e-multiselect.e-rtl .e-multi-select-wrapper.e-close-icon-hide {
3075
+ padding-left: 0;
3076
+ }
3077
+ .e-multiselect.e-rtl .e-multi-select-wrapper {
3078
+ padding: 0 2px 0 32px;
3079
+ }
3080
+ .e-multiselect.e-rtl .e-multi-select-wrapper .e-chips.e-mob-chip.e-chip-selected .e-chips-close::before {
3081
+ left: -12px;
3082
+ }
3083
+ .e-multiselect.e-rtl .e-multi-select-wrapper .e-chips.e-mob-chip.e-chip-selected .e-chips-close {
3084
+ margin: 0;
3085
+ margin-right: auto;
3086
+ }
3087
+ .e-multiselect.e-rtl .e-multi-select-wrapper .e-searcher {
3088
+ float: right;
3089
+ }
3090
+ .e-multiselect.e-rtl .e-multi-select-wrapper .e-chips {
3091
+ float: right;
3092
+ margin: 3px;
3093
+ padding: 0 8px 0 4px;
3094
+ }
3095
+ .e-multiselect.e-rtl .e-multi-select-wrapper .e-chips .e-chipcontent {
3096
+ padding: 5px 4px;
3097
+ }
3098
+ .e-multiselect.e-rtl .e-multi-select-wrapper .e-chips .e-chips-close {
3099
+ float: left;
3100
+ }
3101
+ .e-multiselect.e-rtl .e-multi-select-wrapper .e-chips .e-chips-close::before {
3102
+ left: 0;
3103
+ }
3104
+ .e-multiselect.e-rtl .e-multi-select-wrapper .e-chips.e-mob-chip {
3105
+ padding: 0 4px 0 8px;
3106
+ }
3107
+ .e-multiselect.e-rtl .e-multi-select-wrapper .e-chips.e-mob-chip .e-chipcontent {
3108
+ padding: 8px 4px;
3109
+ }
3110
+ .e-multiselect.e-rtl .e-multi-select-wrapper .e-chips.e-mob-chip.e-chip-selected {
3111
+ padding: 0 8px 0 4px;
3112
+ }
3113
+ .e-multiselect.e-rtl .e-multi-select-wrapper .e-chips.e-mob-chip.e-chip-selected .e-chipcontent {
3114
+ padding: 12px 4px;
3115
+ }
3116
+ .e-multiselect.e-rtl .e-multi-select-wrapper .e-chips-close.e-close-hooker {
3117
+ left: 32px;
3118
+ position: absolute;
3119
+ right: auto;
3120
+ }
3121
+ .e-multiselect.e-rtl .e-multi-select-wrapper .e-close-hooker::before {
3122
+ left: -4px;
3123
+ }
3124
+ .e-multiselect.e-rtl .e-multi-select-wrapper .e-delim-values .e-remain {
3125
+ padding-right: 16px;
2867
3126
  }
2868
3127
 
2869
- .e-dropdownbase .e-list-group-item,
2870
- .e-fixed-head {
2871
- font-size: 12px;
2872
- text-transform: uppercase;
3128
+ .e-multiselect.e-rtl .e-down-icon .e-chips-close.e-close-hooker {
3129
+ left: 32px;
2873
3130
  }
2874
3131
 
2875
- .e-small .e-dropdownbase .e-list-group-item,
2876
- .e-small .e-fixed-head,
2877
- .e-small.e-dropdownbase .e-list-group-item,
2878
- .e-small.e-fixed-head {
2879
- font-size: 10px;
3132
+ .e-multiselect.e-rtl .e-multi-select-wrapper.e-down-icon .e-close-hooker::before {
3133
+ left: -7px;
2880
3134
  }
2881
3135
 
2882
- .e-dropdownbase .e-list-item .e-list-icon {
2883
- padding: 0 8px 0 0;
3136
+ .e-popup.e-multi-select-list-wrapper .e-list-item .e-checkbox-wrapper {
3137
+ bottom: 1px;
3138
+ margin-right: 8px;
3139
+ position: relative;
3140
+ text-indent: 0;
3141
+ vertical-align: middle;
2884
3142
  }
2885
3143
 
2886
- .e-small .e-dropdownbase .e-list-item .e-list-icon {
2887
- padding: 0 4px 0 0;
3144
+ .e-popup.e-multi-select-list-wrapper.e-multiselect-group:not(.e-rtl) .e-list-item .e-checkbox-wrapper {
3145
+ padding-left: 14px;
2888
3146
  }
2889
3147
 
2890
- /* stylelint-disable */
2891
- .e-dropdownbase .e-list-item {
2892
- border-radius: calc(var(--e-radius) * 0.375) !important;
3148
+ .e-popup.e-multi-select-list-wrapper.e-multiselect-group.e-rtl .e-list-item .e-checkbox-wrapper {
3149
+ padding-right: 25px;
2893
3150
  }
2894
3151
 
3152
+ .e-popup.e-multi-select-list-wrapper.e-multiselect-group .e-list-group-item .e-checkbox-wrapper {
3153
+ bottom: 1px;
3154
+ margin-right: 8px;
3155
+ position: relative;
3156
+ text-indent: 0;
3157
+ vertical-align: middle;
3158
+ }
2895
3159
 
3160
+ .e-popup.e-multi-select-list-wrapper.e-rtl .e-list-item .e-checkbox-wrapper {
3161
+ margin-left: 12px;
3162
+ margin-right: 0;
3163
+ }
2896
3164
 
3165
+ .e-popup.e-multi-select-list-wrapper.e-multiselect-group.e-rtl .e-list-group-item .e-checkbox-wrapper {
3166
+ margin-left: 12px;
3167
+ margin-right: 0;
3168
+ }
2897
3169
 
3170
+ .e-popup.e-multi-select-list-wrapper.e-rtl .e-list-item {
3171
+ padding-right: 0;
3172
+ }
2898
3173
 
3174
+ .e-popup.e-multi-select-list-wrapper.e-rtl .e-dropdownbase.e-rtl.e-dd-group .e-list-item {
3175
+ padding-right: 15px;
3176
+ }
2899
3177
 
3178
+ .e-multi-select-list-wrapper .e-selectall-parent {
3179
+ cursor: pointer;
3180
+ display: block;
3181
+ line-height: 30px;
3182
+ overflow: hidden;
3183
+ text-overflow: ellipsis;
3184
+ padding-right: 16px;
3185
+ position: relative;
3186
+ text-indent: 12px;
3187
+ white-space: nowrap;
3188
+ width: 100%;
3189
+ }
2900
3190
 
3191
+ .e-rtl .e-multi-select-list-wrapper .e-selectall-parent,
3192
+ .e-multi-select-list-wrapper.e-rtl .e-selectall-parent {
3193
+ padding-left: 16px;
3194
+ padding-right: 15px;
3195
+ }
2901
3196
 
3197
+ .e-multi-select-list-wrapper .e-selectall-parent .e-all-text {
3198
+ color: var(--color-sf-content-text-color);
3199
+ font-family: var(--e-font-family);
3200
+ font-size: 14px;
3201
+ }
2902
3202
 
2903
- /* Font Family */
2904
- /* Font Sizes */
2905
- /* Radius */
2906
- /* 1px */
3203
+ .e-multi-select-list-wrapper .e-selectall-parent .e-checkbox-wrapper {
3204
+ bottom: 1px;
3205
+ margin-right: 8px;
3206
+ position: relative;
3207
+ text-indent: 0;
3208
+ vertical-align: middle;
3209
+ }
3210
+
3211
+ .e-multi-select-list-wrapper.e-rtl .e-selectall-parent .e-checkbox-wrapper {
3212
+ margin-left: 12px;
3213
+ margin-right: 0;
3214
+ }
3215
+
3216
+ .e-multiselect .e-input-group-icon.e-ddl-icon {
3217
+ float: right;
3218
+ margin-top: 0;
3219
+ }
3220
+
3221
+ .e-multiselect.e-rtl .e-input-group-icon.e-ddl-icon {
3222
+ float: left;
3223
+ }
3224
+
3225
+ .e-multiselect.e-control-wrapper.e-checkbox .e-multi-select-wrapper.e-down-icon {
3226
+ padding-right: 0 48px 0 0;
3227
+ }
3228
+
3229
+ .e-multiselect .e-multi-select-wrapper.e-down-icon {
3230
+ padding: 1px 0;
3231
+ }
3232
+
3233
+ .e-ddl.e-popup.e-multi-select-list-wrapper .e-filter-parent .e-input-group:not(.e-control-container) .e-clear-icon {
3234
+ padding-left: 8px;
3235
+ }
3236
+
3237
+ .e-ddl.e-popup.e-multi-select-list-wrapper .e-filter-parent .e-back-icon {
3238
+ padding: 0 8px;
3239
+ }
3240
+
3241
+ .e-checkbox .e-multi-select-wrapper .e-delim-values .e-remain {
3242
+ line-height: 20px;
3243
+ padding-left: 10px;
3244
+ }
3245
+
3246
+ .e-popup.e-multi-select-list-wrapper .e-list-item.e-disable .e-checkbox-wrapper .e-frame,
3247
+ .e-popup.e-multi-select-list-wrapper .e-list-group-item.e-disable .e-checkbox-wrapper .e-frame {
3248
+ opacity: 0.3;
3249
+ }
3250
+
3251
+ .e-popup.e-multi-select-list-wrapper .e-list-item.e-disable,
3252
+ .e-popup.e-multi-select-list-wrapper.e-multiselect-group.e-checkbox .e-list-group-item.e-disable {
3253
+ opacity: 0.7;
3254
+ }
3255
+
3256
+ .e-multi-select-wrapper input[readonly=true] {
3257
+ pointer-events: none;
3258
+ }
3259
+
3260
+ .e-multiselect.e-checkbox .e-multi-select-wrapper .e-searcher {
3261
+ pointer-events: none;
3262
+ }
3263
+
3264
+ ejs-multiselect {
3265
+ display: block;
3266
+ }
3267
+
3268
+ .e-small.e-multi-select-list-wrapper .e-selectall-parent,
3269
+ .e-small .e-multi-select-list-wrapper .e-selectall-parent {
3270
+ line-height: 24px;
3271
+ }
3272
+
3273
+ .e-small .e-multi-select-wrapper .e-chips-close {
3274
+ height: 14px;
3275
+ width: 14px;
3276
+ }
3277
+
3278
+ .e-small .e-multi-select-wrapper {
3279
+ min-height: 24px;
3280
+ }
3281
+
3282
+ .e-small .e-multi-select-wrapper input[type=text] {
3283
+ height: 24px;
3284
+ min-height: 24px;
3285
+ }
3286
+
3287
+ .e-small .e-multi-select-wrapper .e-delim-values {
3288
+ font-size: 12px;
3289
+ line-height: 24px;
3290
+ }
3291
+
3292
+ .e-small.e-multiselect.e-control-container .e-multi-select-wrapper .e-ddl-icon,
3293
+ .e-small.e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-ddl-icon {
3294
+ margin-top: -1.3em;
3295
+ }
3296
+
3297
+ .e-content-placeholder.e-multiselect.e-placeholder-multiselect {
3298
+ background-size: 300px 33px;
3299
+ min-height: 33px;
3300
+ }
3301
+
3302
+ .e-multiselect.e-outline .e-multi-select-wrapper input[type=text] {
3303
+ color: inherit;
3304
+ }
3305
+
3306
+ .e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker,
3307
+ .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
3308
+ -webkit-box-align: normal;
3309
+ -ms-flex-align: normal;
3310
+ align-items: normal;
3311
+ }
3312
+
3313
+ .e-filled.e-multiselect:not(.e-float-input) .e-multi-select-wrapper {
3314
+ padding: 0 12px 0 8px;
3315
+ }
3316
+
3317
+ .e-multiselect.e-filled.e-input-group.e-control-wrapper {
3318
+ padding: 0;
3319
+ }
3320
+
3321
+ .e-filled.e-float-input .e-multi-select-wrapper {
3322
+ padding: 11px 12px 0;
3323
+ }
3324
+
3325
+ .e-small.e-filled.e-float-input .e-multi-select-wrapper,
3326
+ .e-small .e-filled.e-float-input .e-multi-select-wrapper {
3327
+ padding: 12px 12px 0 8px;
3328
+ }
3329
+
3330
+ .e-rtl.e-multiselect.e-filled.e-input-group.e-control-wrapper,
3331
+ .e-rtl.e-multiselect.e-filled.e-float-input.e-control-wrapper {
3332
+ padding: 0;
3333
+ }
3334
+
3335
+ .e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips {
3336
+ height: 28px;
3337
+ }
3338
+
3339
+ .e-small.e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips,
3340
+ .e-small .e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips,
3341
+ .e-multiselect.e-filled.e-float-input .e-multi-select-wrapper.e-mob-wrapper .e-chips.e-mob-chip,
3342
+ .e-small .e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips,
3343
+ .e-small.e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips {
3344
+ height: 24px;
3345
+ }
3346
+
3347
+ .e-filled.e-float-input .e-multi-select-wrapper .e-chips {
3348
+ height: 18px;
3349
+ }
3350
+
3351
+ .e-filled.e-float-input .e-multi-select-wrapper .e-chips,
3352
+ .e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips {
3353
+ margin: 8px 8px 0 0;
3354
+ padding: 0 8px;
3355
+ }
3356
+
3357
+ .e-rtl.e-filled.e-float-input .e-multi-select-wrapper .e-chips,
3358
+ .e-rtl.e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips {
3359
+ margin: 8px 0 0 8px;
3360
+ padding: 0 8px;
3361
+ }
3362
+
3363
+ .e-small .e-filled .e-multi-select-wrapper .e-chips,
3364
+ .e-small.e-filled .e-multi-select-wrapper .e-chips {
3365
+ height: 16px 16px;
3366
+ margin: 4px 4px 0 0;
3367
+ padding-right: 8px;
3368
+ }
3369
+
3370
+ .e.rtl.e-small .e-filled.e-float-input .e-multi-select-wrapper .e-chips,
3371
+ .e-rtl.e-small.e-filled.e-float-input .e-multi-select-wrapper .e-chips {
3372
+ margin: 4px 0 0 4px;
3373
+ }
3374
+
3375
+ .e-filled.e-multiselect:not(.e-float-input) .e-multi-select-wrapper .e-chips > .e-chipcontent {
3376
+ font-size: 13px;
3377
+ padding: 0 8px 0 0;
3378
+ }
3379
+
3380
+ .e-small.e-filled.e-multiselect .e-multi-select-wrapper .e-chips > .e-chipcontent,
3381
+ .e-small .e-filled.e-multiselect .e-multi-select-wrapper .e-chips > .e-chipcontent {
3382
+ font-size: 12px;
3383
+ }
3384
+
3385
+ .e-filled.e-float-input.e-multiselect .e-multi-select-wrapper .e-chips > .e-chipcontent {
3386
+ font-size: 12px;
3387
+ padding: 0 4px 0 0;
3388
+ }
3389
+
3390
+ .e-rtl.e-filled.e-multiselect .e-multi-select-wrapper .e-chips > .e-chipcontent {
3391
+ padding: 0 0 0 4px;
3392
+ }
3393
+
3394
+ .e-small.e-filled.e-float-input.e-multiselect .e-multi-select-wrapper .e-chips > .e-chipcontent,
3395
+ .e-small .e-filled.e-float-input.e-multiselect .e-multi-select-wrapper .e-chips > .e-chipcontent {
3396
+ font-size: 10px;
3397
+ }
3398
+
3399
+ .e-filled.e-multiselect.e-float-input .e-multi-select-wrapper.e-mob-wrapper .e-chips > .e-chipcontent {
3400
+ font-size: 13px;
3401
+ padding-right: 4px;
3402
+ }
3403
+
3404
+ .e-filled.e-multi-select-wrapper .e-chips-close.e-close-hooker,
3405
+ .e-multiselect.e-control-container .e-filled.e-multi-select-wrapper .e-clear-icon {
3406
+ height: 38px;
3407
+ margin-top: -38px;
3408
+ right: 12px;
3409
+ top: 100%;
3410
+ width: 16px;
3411
+ }
3412
+
3413
+ .e-multiselect.e-control-wrapper.e-input-group.e-readonly .e-clear-icon,
3414
+ .e-outline.e-multiselect.e-control-wrapper.e-input-group.e-readonly .e-clear-icon,
3415
+ .e-filled.e-multiselect.e-control-wrapper.e-input-group.e-readonly .e-clear-icon,
3416
+ .e-multiselect.e-readonly.e-control-wrapper.e-input-group.e-control-container :not(.e-disabled).e-multi-select-wrapper:hover .e-clear-icon,
3417
+ .e-multiselect.e-readonly.e-control-wrapper.e-input-group.e-control-container.e-input-group :not(.e-disabled).e-multi-select-wrapper:hover .e-clear-icon {
3418
+ display: none;
3419
+ }
3420
+
3421
+ .e-multiselect.e-input-group.e-control-wrapper .e-input-group-icon {
3422
+ margin-right: 0;
3423
+ }
3424
+
3425
+ .e-multiselect.e-control-container.e-input-group.e-disabled .e-input-group-icon.e-ddl-icon.e-icons,
3426
+ .e-multiselect.e-control-container.e-input-group.e-disabled .e-clear-icon {
3427
+ cursor: not-allowed;
3428
+ }
3429
+
3430
+ .e-multiselect.e-control-wrapper.e-control-container.e-input-group.e-checkbox .e-multi-select-wrapper.e-down-icon,
3431
+ .e-multiselect.e-control-wrapper.e-control-container.e-input-group.e-checkbox .e-multi-select-wrapper.e-down-icon .e-multi-searcher .e-dropdownbase.e-control.e-multiselect.e-lib {
3432
+ cursor: pointer;
3433
+ }
3434
+
3435
+ .e-popup.e-multi-select-list-wrapper.e-resize .e-resizer-right {
3436
+ bottom: 0;
3437
+ right: 0;
3438
+ cursor: nwse-resize;
3439
+ height: 15px;
3440
+ position: absolute;
3441
+ width: 15px;
3442
+ }
3443
+
3444
+
3445
+
3446
+
3447
+
3448
+
3449
+
3450
+
3451
+
3452
+ /* Font Family */
3453
+ /* Font Sizes */
3454
+ /* Radius */
3455
+ /* 1px */
2907
3456
  /* 2px */
2908
3457
  /* 3px */
2909
3458
  /* 4px */
@@ -3090,783 +3639,812 @@ ejs-dropdownlist {
3090
3639
  width: 20px;
3091
3640
  }
3092
3641
 
3093
- .e-multi-select-wrapper {
3094
- -webkit-box-sizing: border-box;
3095
- box-sizing: border-box;
3096
- cursor: text;
3097
- line-height: normal;
3098
- min-height: 28px;
3099
- padding: 1px 32px 1px 0;
3100
- position: relative;
3101
- -webkit-user-select: none;
3102
- -moz-user-select: none;
3103
- -ms-user-select: none;
3104
- user-select: none;
3105
- width: 100%;
3106
- }
3107
- .e-multi-select-wrapper.e-delimiter .e-searcher, .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
3108
- height: 27px;
3109
- vertical-align: middle;
3642
+ .e-multi-select-wrapper .e-chips.e-chip-selected .e-chips-close::before {
3643
+ color: var(--color-sf-content-text-color);
3110
3644
  }
3111
- .e-multi-select-wrapper.e-delimiter .e-searcher .e-dropdownbase, .e-multi-select-wrapper.e-delimiter .e-multi-searcher .e-dropdownbase {
3112
- height: 100%;
3113
- min-height: 100%;
3645
+
3646
+ .e-multi-select-wrapper .e-chips.e-chip-selected {
3647
+ background-color: var(--color-sf-content-bg-color-alt5);
3114
3648
  }
3115
- .e-multi-select-wrapper .e-delim-view {
3116
- white-space: nowrap;
3649
+
3650
+ .e-multiselect:not(.e-disabled) .e-multi-select-wrapper .e-chips.e-chip-selected:hover {
3651
+ background-color: var(--color-sf-content-bg-color-alt5);
3117
3652
  }
3118
- .e-multi-select-wrapper .e-delim-view.e-delim-values.e-delim-overflow, .e-multi-select-wrapper .e-delim-view.e-delim-values.e-delim-total {
3653
+
3654
+ .e-multiselect {
3119
3655
  -webkit-box-sizing: border-box;
3120
3656
  box-sizing: border-box;
3121
- display: inline-block;
3122
- overflow: hidden;
3123
- text-overflow: ellipsis;
3124
3657
  }
3125
- .e-multi-select-wrapper .e-chips.e-mob-chip.e-chip-selected .e-chips-close::before {
3658
+
3659
+ /* stylelint-disable property-no-vendor-prefix */
3660
+ .e-multi-select-wrapper .e-chips > .e-chipcontent {
3661
+ -webkit-text-fill-color: var(--color-sf-content-text-color);
3126
3662
  color: var(--color-sf-content-text-color);
3127
- font-size: 16px;
3128
- left: 12px;
3129
- top: 0;
3663
+ font-family: var(--e-font-family);
3664
+ font-size: 14px;
3130
3665
  }
3131
- .e-multi-select-wrapper .e-chips.e-mob-chip.e-chip-selected .e-chipcontent {
3132
- background-color: var(--color-sf-primary);
3666
+
3667
+ .e-multi-select-wrapper .e-chips.e-chip-selected > .e-chipcontent {
3133
3668
  color: var(--color-sf-content-text-color);
3134
- padding: 12px 4px 11px 0;
3135
3669
  }
3136
- .e-multi-select-wrapper .e-searcher.e-zero-size:not(.e-multiselect-box),
3137
- .e-multi-select-wrapper .e-multi-searcher.e-zero-size:not(.e-multiselect-box) {
3138
- width: 0;
3139
- }
3140
- .e-multi-select-wrapper .e-searcher.e-zero-size:not(.e-multiselect-box) input[type=text],
3141
- .e-multi-select-wrapper .e-multi-searcher.e-zero-size:not(.e-multiselect-box) input[type=text] {
3142
- height: 1px;
3143
- min-height: 1px;
3144
- }
3145
- .e-multi-select-wrapper .e-chips.e-mob-chip > .e-chipcontent {
3146
- max-width: 100%;
3670
+
3671
+ .e-multi-select-wrapper .e-chips.e-chip-selected > .e-chipcontent:hover {
3672
+ color: var(--color-sf-content-text-color-hover);
3147
3673
  }
3148
3674
 
3149
- .e-multiselect.e-control-container .e-multi-select-wrapper .e-multi-searcher,
3150
- .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-multi-searcher {
3151
- display: -webkit-box;
3152
- display: -ms-flexbox;
3153
- display: flex;
3154
- float: left;
3155
- width: auto;
3675
+ .e-multi-select-wrapper .e-chips {
3676
+ background-color: var(--color-sf-chip-bg-color);
3677
+ border: 1px solid var(--color-sf-chip-border-color);
3678
+ border-radius: calc(var(--e-radius) * 0.375);
3679
+ height: 22px;
3156
3680
  }
3157
- .e-multiselect.e-control-container .e-multi-select-wrapper.e-delimiter .e-multi-searcher,
3158
- .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
3159
- display: -webkit-inline-box;
3160
- display: -ms-inline-flexbox;
3161
- display: inline-flex;
3162
- float: none;
3681
+
3682
+ .e-multiselect:not(.e-disabled) .e-multi-select-wrapper .e-chips:hover {
3683
+ background-color: var(--color-sf-content-bg-color-alt4);
3163
3684
  }
3164
- .e-multiselect.e-control-container .e-multi-select-wrapper .e-multi-searcher.e-zero-size:not(.e-multiselect-box),
3165
- .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-multi-searcher.e-zero-size:not(.e-multiselect-box) {
3166
- width: 0;
3685
+
3686
+ .e-multi-select-wrapper .e-chips > .e-chipcontent:hover {
3687
+ color: var(--color-sf-content-text-color-hover);
3167
3688
  }
3168
- .e-multiselect.e-control-container .e-multi-select-wrapper .e-delim-values.e-delim-hide,
3169
- .e-multiselect.e-control-container .e-multi-select-wrapper .e-delim-view.e-delim-values.e-delim-hide,
3170
- .e-multiselect.e-control-container .e-multi-select-wrapper .e-chips-collection.e-delim-hide,
3171
- .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-delim-values.e-delim-hide,
3172
- .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-delim-view.e-delim-values.e-delim-hide,
3173
- .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-chips-collection.e-delim-hide {
3174
- display: none;
3689
+
3690
+ .e-multi-select-wrapper .e-chips .e-chips-close::before {
3691
+ -webkit-text-fill-color: var(--color-sf-icon-color);
3692
+ color: var(--color-sf-icon-color);
3693
+ font-size: 16px;
3175
3694
  }
3176
- .e-multiselect.e-control-container .e-multi-select-wrapper .e-delim-values,
3177
- .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-delim-values {
3178
- -webkit-box-align: center;
3179
- -ms-flex-align: center;
3180
- align-items: center;
3181
- display: inline;
3182
- max-width: 100%;
3183
- word-break: break-word;
3695
+
3696
+ .e-multi-select-wrapper .e-chips.e-mob-chip.e-chip-selected {
3697
+ background-color: var(--color-sf-primary);
3698
+ border-radius: calc(var(--e-radius) * 0.375);
3699
+ color: var(--color-sf-content-text-color);
3700
+ height: 40px;
3701
+ line-height: 40px;
3184
3702
  }
3185
- .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
3186
- .e-multiselect.e-control-container .e-multi-select-wrapper .e-ddl-icon,
3187
- .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-clear-icon,
3188
- .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-ddl-icon {
3189
- -webkit-box-align: center;
3190
- -ms-flex-align: center;
3191
- align-items: center;
3192
- cursor: pointer;
3193
- display: none;
3194
- -webkit-box-orient: horizontal;
3195
- -webkit-box-direction: normal;
3196
- -ms-flex-direction: row;
3197
- flex-direction: row;
3198
- margin-top: -2em;
3199
- outline: 0;
3200
- padding: 0;
3201
- position: absolute;
3202
- right: 5px;
3203
- top: 100%;
3703
+
3704
+ .e-multi-select-wrapper .e-chips.e-mob-chip.e-chip-selected .e-chipcontent {
3705
+ color: var(--color-sf-content-text-color);
3204
3706
  }
3205
- .e-multiselect.e-control-container :not(.e-disabled).e-multi-select-wrapper:hover .e-clear-icon,
3206
- .e-multiselect.e-control-container .e-multi-select-wrapper .e-ddl-icon,
3207
- .e-multiselect.e-control-container.e-input-group :not(.e-disabled).e-multi-select-wrapper:hover .e-clear-icon,
3208
- .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-ddl-icon {
3209
- display: -webkit-box;
3210
- display: -ms-flexbox;
3211
- display: flex;
3707
+
3708
+ .e-multi-select-wrapper .e-chips.e-mob-chip {
3709
+ height: 30px;
3212
3710
  }
3213
- .e-multiselect.e-control-container .e-multi-select-wrapper .e-ddl-icon,
3214
- .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-ddl-icon {
3215
- margin-right: 0;
3216
- margin-top: -2.3em;
3217
- right: 0;
3218
- padding: 9px;
3711
+
3712
+ .e-popup.e-multi-select-list-wrapper {
3713
+ -webkit-box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.14), 0 0 2px 0 rgba(0, 0, 0, 0.12);
3714
+ box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.14), 0 0 2px 0 rgba(0, 0, 0, 0.12);
3715
+ -webkit-box-sizing: content-box;
3716
+ box-sizing: content-box;
3717
+ overflow: initial;
3219
3718
  }
3220
- .e-multiselect.e-control-container .e-multi-select-wrapper.e-delimiter,
3221
- .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper.e-delimiter {
3222
- top: -1px;
3719
+
3720
+ .e-popup.e-multi-select-list-wrapper .e-list-item.e-active {
3721
+ border-bottom: 1px solid transparent;
3722
+ border-left: 1px solid var(--color-sf-content-bg-color-selected);
3723
+ border-right: 1px solid var(--color-sf-content-bg-color-selected);
3724
+ border-top: 1px solid var(--color-sf-border-selected);
3223
3725
  }
3224
- .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
3225
- .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-clear-icon {
3226
- font-size: 14px;
3227
- height: 28px;
3228
- width: 28px;
3726
+
3727
+ .e-popup.e-multi-select-list-wrapper.e-checkbox .e-list-item.e-active {
3728
+ background-color: transparent;
3729
+ border-color: transparent;
3730
+ color: var(--color-sf-content-text-color);
3229
3731
  }
3230
3732
 
3231
- .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-multi-searcher,
3232
- .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-multi-searcher {
3233
- float: right;
3733
+ .e-popup.e-multi-select-list-wrapper.e-multiselect-group.e-checkbox .e-list-group-item.e-active {
3734
+ background-color: transparent;
3735
+ border-color: transparent;
3736
+ color: var(--color-sf-content-text-color);
3234
3737
  }
3235
- .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher,
3236
- .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper.e-delimiter .e-multi-searcher {
3237
- float: none;
3738
+
3739
+ .e-popup.e-multi-select-list-wrapper.e-checkbox .e-list-item.e-active.e-item-focus {
3740
+ color: var(--color-sf-content-text-color);
3741
+ color: var(--color-sf-flyout-text-color-selected);
3238
3742
  }
3239
- .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-clear-icon,
3240
- .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper .e-ddl-icon,
3241
- .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-clear-icon,
3242
- .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper .e-ddl-icon {
3243
- left: 0;
3244
- right: auto;
3743
+
3744
+ .e-popup.e-multi-select-list-wrapper.e-multiselect-group.e-checkbox .e-list-group-item.e-active.e-item-focus {
3745
+ color: var(--color-sf-content-text-color);
3245
3746
  }
3246
- .e-multiselect.e-control-container.e-rtl .e-multi-select-wrapper.e-down-icon,
3247
- .e-multiselect.e-control-container.e-input-group.e-rtl .e-multi-select-wrapper.e-down-icon {
3248
- padding: 0 0 0 48px;
3747
+
3748
+ .e-popup.e-multi-select-list-wrapper.e-checkbox .e-list-item.e-active.e-hover {
3749
+ background-color: var(--color-sf-content-bg-color-hover);
3750
+ color: var(--color-sf-flyout-text-color-focus);
3249
3751
  }
3250
3752
 
3251
- .e-popup.e-multi-select-list-wrapper .e-list-item.e-disabled,
3252
- .e-popup.e-multi-select-list-wrapper.e-multiselect-group.e-checkbox .e-list-group-item.e-disabled {
3253
- opacity: 0.7;
3254
- pointer-events: none;
3753
+ .e-popup.e-multi-select-list-wrapper.e-multiselect-group.e-checkbox .e-list-group-item.e-active.e-hover {
3754
+ background-color: var(--color-sf-content-bg-color-hover);
3255
3755
  }
3256
3756
 
3257
- .e-multiselect.e-input-group,
3258
- .e-multiselect.e-float-input {
3259
- word-wrap: initial;
3757
+ .e-popup.e-multi-select-list-wrapper .e-list-item.e-active:first-child {
3758
+ border-bottom: 1px solid transparent;
3759
+ border-top: 1px solid transparent;
3260
3760
  }
3261
3761
 
3262
- .e-multiselect.e-input-group .e-searcher .e-label-top,
3263
- .e-multiselect.e-input-group .e-multi-searcher .e-label-top {
3264
- top: 15px;
3762
+ .e-popup.e-multi-select-list-wrapper .e-list-item.e-active:last-child {
3763
+ border-bottom: 1px solid transparent;
3265
3764
  }
3266
3765
 
3267
- .e-multi-select-wrapper.e-close-icon-hide {
3268
- padding-right: 0;
3766
+ .e-popup.e-multi-select-list-wrapper .e-list-item.e-active.e-item-focus + li.e-active {
3767
+ border-top: 1px solid transparent;
3269
3768
  }
3270
3769
 
3271
- .e-multi-select-wrapper .e-chips-collection {
3272
- cursor: default;
3273
- display: block;
3770
+ .e-popup.e-multi-select-list-wrapper .e-list-item.e-active.e-item-focus {
3771
+ background-color: var(--color-sf-content-bg-color-selected);
3772
+ -webkit-box-shadow: none;
3773
+ box-shadow: none;
3774
+ color: var(--color-sf-content-text-color-selected);
3775
+ border: 1px solid transparent;
3274
3776
  }
3275
3777
 
3276
- .e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
3277
- margin-right: 30px;
3778
+ .e-popup.e-multi-select-list-wrapper.e-multiselect-group .e-list-group-item.e-active.e-item-focus {
3779
+ background-color: var(--color-sf-content-bg-color-selected);
3780
+ -webkit-box-shadow: none;
3781
+ box-shadow: none;
3782
+ color: var(--color-sf-content-text-color-selected);
3783
+ border: 1px solid transparent;
3278
3784
  }
3279
3785
 
3280
- .e-multi-select-wrapper .e-multi-hidden {
3281
- border: 0;
3282
- height: 0;
3283
- position: absolute;
3284
- visibility: hidden;
3285
- width: 0;
3786
+ .e-popup.e-multi-select-list-wrapper .e-list-item {
3787
+ border: 0 solid transparent;
3286
3788
  }
3287
3789
 
3288
- .e-multi-select-wrapper .e-chips {
3289
- -webkit-box-align: center;
3290
- -ms-flex-align: center;
3291
- align-items: center;
3292
- display: -webkit-inline-box;
3293
- display: -ms-inline-flexbox;
3294
- display: inline-flex;
3295
- float: left;
3296
- margin: 3px;
3297
- max-width: 100%;
3298
- overflow: hidden;
3299
- padding: 0 4px 0 8px;
3300
- text-overflow: ellipsis;
3301
- white-space: nowrap;
3790
+ .e-popup.e-multi-select-list-wrapper.e-multiselect-group .e-list-group-item {
3791
+ border: 0 solid transparent;
3302
3792
  }
3303
3793
 
3304
- .e-multi-select-wrapper .e-chips > .e-chipcontent {
3305
- max-width: 100%;
3306
- overflow: hidden;
3307
- padding: 0 4px 0 0;
3308
- text-indent: 0;
3309
- text-overflow: ellipsis;
3310
- white-space: nowrap;
3794
+ .e-multi-select-wrapper input.e-dropdownbase:-moz-placeholder { /* stylelint-disable-line selector-no-vendor-prefix */
3795
+ color: var(--color-sf-placeholder-text-color);
3311
3796
  }
3312
3797
 
3313
- .e-multi-select-wrapper.e-delimiter .e-searcher {
3314
- display: inline-block;
3315
- float: none;
3798
+ .e-multi-select-wrapper input.e-dropdownbase::-moz-placeholder { /* stylelint-disable-line selector-no-vendor-prefix */
3799
+ color: var(--color-sf-placeholder-text-color);
3316
3800
  }
3317
3801
 
3318
- .e-multi-select-wrapper .e-mob-chip.e-chips > .e-chipcontent {
3319
- padding: 8px 4px 8px 0;
3802
+ .e-multi-select-wrapper input.e-dropdownbase:-ms-input-placeholder { /* stylelint-disable-line selector-no-vendor-prefix */
3803
+ color: var(--color-sf-placeholder-text-color);
3320
3804
  }
3321
3805
 
3322
- .e-multiselect.e-rtl .e-multi-select-wrapper .e-mob-chip.e-chips > .e-chipcontent {
3323
- padding: 8px 0 8px 4px;
3806
+ .e-multi-select-wrapper input.e-dropdownbase::-webkit-input-placeholder { /* stylelint-disable-line selector-no-vendor-prefix */
3807
+ color: var(--color-sf-placeholder-text-color);
3324
3808
  }
3325
3809
 
3326
- .e-multi-select-wrapper .e-chips-close {
3327
- -ms-flex-item-align: center;
3328
- align-self: center;
3329
- display: -webkit-box;
3330
- display: -ms-flexbox;
3331
- display: flex;
3332
- float: right;
3333
- font-family: "e-icons";
3334
- height: 16px;
3335
- margin: 0 0 0;
3336
- width: 16px;
3810
+ .e-ul.e-reorder {
3811
+ border-bottom: 1px solid var(--color-sf-border-light);
3337
3812
  }
3338
3813
 
3339
- .e-rtl .e-multi-select-wrapper .e-chips-close {
3340
- margin: 0 0 0;
3814
+ .e-multi-select-list-wrapper .e-selectall-parent {
3815
+ border-bottom: 1px solid var(--color-sf-border-light);
3341
3816
  }
3342
3817
 
3343
- .e-multi-select-wrapper .e-mob-chip.e-chips .e-chips-close {
3344
- margin: 3px 0 0;
3818
+ .e-multi-select-wrapper .e-delim-values {
3819
+ -webkit-text-fill-color: var(--color-sf-content-text-color);
3820
+ color: var(--color-sf-content-text-color);
3345
3821
  }
3346
3822
 
3347
3823
  .e-multi-select-wrapper .e-chips-close.e-close-hooker {
3348
- cursor: default;
3349
- font-size: 14px;
3350
- height: 28px;
3351
- margin-top: -2em;
3352
- position: absolute;
3353
- right: 5px;
3354
- width: 28px;
3355
- top: 100%;
3356
- }
3357
-
3358
- .e-multiselect .e-down-icon .e-chips-close.e-close-hooker,
3359
- .e-small.e-multiselect .e-down-icon .e-chips-close.e-close-hooker,
3360
- .e-multiselect.e-input-group.e-control-container .e-multi-select-wrapper.e-down-icon .e-clear-icon {
3361
- right: 32px;
3824
+ color: var(--color-sf-icon-color);
3362
3825
  }
3363
3826
 
3364
- .e-multiselect.e-input-group.e-control-container.e-rtl .e-multi-select-wrapper.e-down-icon .e-clear-icon {
3365
- left: 32px;
3366
- right: auto;
3827
+ .e-small .e-multi-select-wrapper .e-chips {
3828
+ height: 18px;
3367
3829
  }
3368
3830
 
3369
- .e-multi-select-wrapper input[type=text] {
3370
- background: none;
3371
- border: 0;
3372
- font-family: var(--e-font-family);
3373
- font-size: 14px;
3374
- font-weight: normal;
3375
- height: 28px;
3376
- min-height: 28px;
3377
- outline: none;
3378
- padding: 4px 0 4px 12px;
3379
- text-indent: 0;
3831
+ .e-small .e-multi-select-wrapper .e-chips > .e-chipcontent {
3832
+ font-size: 12px;
3380
3833
  }
3381
3834
 
3382
- .e-multiselect.e-filled .e-multi-select-wrapper input[type=text] {
3383
- background: none;
3384
- border: 0;
3385
- color: inherit;
3386
- font-family: var(--e-font-family);
3835
+ .e-small .e-multi-select-wrapper .e-chips .e-chips-close::before {
3387
3836
  font-size: 14px;
3388
- font-weight: normal;
3389
- height: 28px;
3390
- min-height: 28px;
3391
- outline: none;
3392
- padding: 0;
3393
- text-indent: 10px;
3394
- }
3395
-
3396
- .e-rtl.e-multiselect.e-filled .e-multi-select-wrapper input[type=text] {
3397
- padding: 5px;
3398
- }
3399
-
3400
- /* stylelint-disable property-no-vendor-prefix */
3401
- .e-multi-select-wrapper input[type=text]::-ms-clear {
3402
- display: none;
3403
3837
  }
3404
3838
 
3405
- .e-multi-select-wrapper .e-searcher {
3406
- display: block;
3407
- float: left;
3408
- width: auto;
3839
+ .e-small .e-multi-select-wrapper .e-close-hooker::before {
3840
+ left: 6px;
3409
3841
  }
3410
3842
 
3411
- .e-multiselect .e-multi-select-wrapper.e-down-icon .e-searcher.e-search-custom-width {
3412
- width: calc(100% - 32px);
3843
+ .e-multiselect.e-disabled .e-multi-select-wrapper .e-delim-values {
3844
+ -webkit-text-fill-color: var(--color-sf-content-text-color-disabled);
3845
+ color: var(--color-sf-content-text-color-disabled);
3413
3846
  }
3414
3847
 
3415
- .e-small .e-multiselect .e-multi-select-wrapper.e-down-icon .e-searcher.e-search-custom-width,
3416
- .e-small.e-multiselect .e-multi-select-wrapper.e-down-icon .e-searcher.e-search-custom-width {
3417
- width: calc(100% - 30px);
3848
+ .e-listbox-tool .e-moveup::before {
3849
+ content: "\e776";
3418
3850
  }
3419
3851
 
3420
- .e-multi-select-wrapper .e-delim-values {
3421
- font-family: var(--e-font-family);
3422
- font-size: 14px;
3423
- line-height: 28px;
3424
- max-width: 100%;
3425
- padding-left: 10px;
3426
- padding-right: 6px;
3427
- vertical-align: middle;
3852
+ .e-listbox-tool .e-movedown::before {
3853
+ content: "\e729";
3428
3854
  }
3429
3855
 
3430
- .e-multi-select-list-wrapper .e-hide-listitem,
3431
- .e-multi-select-list-wrapper .e-hide-group-header {
3432
- display: none;
3856
+ .e-listbox-tool .e-moveto::before {
3857
+ content: "\e748";
3433
3858
  }
3434
3859
 
3435
- .e-multi-select-wrapper .e-delim-values .e-remain {
3436
- color: var(--color-sf-content-text-color);
3437
- cursor: pointer;
3438
- display: inline-block;
3439
- font-size: 14px;
3440
- padding-left: 16px;
3860
+ .e-listbox-tool .e-movefrom::before {
3861
+ content: "\e765";
3441
3862
  }
3442
3863
 
3443
- .e-multiselect.e-disabled .e-multi-select-wrapper,
3444
- .e-multiselect.e-disabled .e-multi-select-wrapper .e-chips .e-chips-close::before {
3445
- cursor: not-allowed;
3864
+ .e-listbox-tool .e-moveallto::before {
3865
+ content: "\e7a9";
3446
3866
  }
3447
3867
 
3448
- .e-multi-select-wrapper .e-chips.e-mob-chip.e-chip-selected .e-chips-close {
3449
- height: 40px;
3450
- left: 0;
3451
- margin: 0 0 0 0;
3452
- margin-left: auto;
3453
- position: relative;
3454
- top: 0;
3455
- width: 40px;
3868
+ .e-listbox-tool .e-moveallfrom::before {
3869
+ content: "\e744";
3456
3870
  }
3457
3871
 
3458
- .e-multi-select-wrapper .e-chips.e-mob-chip.e-chip-selected {
3459
- -ms-flex-item-align: center;
3460
- align-self: center;
3461
- -webkit-box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.21);
3462
- box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.21);
3463
- display: -webkit-inline-box;
3464
- display: -ms-inline-flexbox;
3465
- display: inline-flex;
3466
- padding: 0 0 0 16px;
3467
- width: 92%;
3468
- }
3469
3872
 
3470
- .e-multi-select-wrapper .e-ddl-disable-icon::before {
3471
- content: "";
3472
- }
3473
3873
 
3474
- .e-multiselect.e-rtl .e-multi-select-wrapper.e-delimiter .e-searcher {
3475
- float: none;
3476
- }
3477
3874
 
3478
- .e-multiselect.e-rtl .e-multi-select-wrapper.e-close-icon-hide {
3479
- padding-left: 0;
3480
- }
3481
- .e-multiselect.e-rtl .e-multi-select-wrapper {
3482
- padding: 0 2px 0 32px;
3483
- }
3484
- .e-multiselect.e-rtl .e-multi-select-wrapper .e-chips.e-mob-chip.e-chip-selected .e-chips-close::before {
3485
- left: -12px;
3486
- }
3487
- .e-multiselect.e-rtl .e-multi-select-wrapper .e-chips.e-mob-chip.e-chip-selected .e-chips-close {
3488
- margin: 0;
3489
- margin-right: auto;
3490
- }
3491
- .e-multiselect.e-rtl .e-multi-select-wrapper .e-searcher {
3492
- float: right;
3493
- }
3494
- .e-multiselect.e-rtl .e-multi-select-wrapper .e-chips {
3495
- float: right;
3496
- margin: 3px;
3497
- padding: 0 8px 0 4px;
3498
- }
3499
- .e-multiselect.e-rtl .e-multi-select-wrapper .e-chips .e-chipcontent {
3500
- padding: 5px 4px;
3501
- }
3502
- .e-multiselect.e-rtl .e-multi-select-wrapper .e-chips .e-chips-close {
3503
- float: left;
3504
- }
3505
- .e-multiselect.e-rtl .e-multi-select-wrapper .e-chips .e-chips-close::before {
3506
- left: 0;
3507
- }
3508
- .e-multiselect.e-rtl .e-multi-select-wrapper .e-chips.e-mob-chip {
3509
- padding: 0 4px 0 8px;
3510
- }
3511
- .e-multiselect.e-rtl .e-multi-select-wrapper .e-chips.e-mob-chip .e-chipcontent {
3512
- padding: 8px 4px;
3513
- }
3514
- .e-multiselect.e-rtl .e-multi-select-wrapper .e-chips.e-mob-chip.e-chip-selected {
3515
- padding: 0 8px 0 4px;
3516
- }
3517
- .e-multiselect.e-rtl .e-multi-select-wrapper .e-chips.e-mob-chip.e-chip-selected .e-chipcontent {
3518
- padding: 12px 4px;
3519
- }
3520
- .e-multiselect.e-rtl .e-multi-select-wrapper .e-chips-close.e-close-hooker {
3521
- left: 32px;
3522
- position: absolute;
3523
- right: auto;
3524
- }
3525
- .e-multiselect.e-rtl .e-multi-select-wrapper .e-close-hooker::before {
3526
- left: -4px;
3527
- }
3528
- .e-multiselect.e-rtl .e-multi-select-wrapper .e-delim-values .e-remain {
3529
- padding-right: 16px;
3530
- }
3531
3875
 
3532
- .e-multiselect.e-rtl .e-down-icon .e-chips-close.e-close-hooker {
3533
- left: 32px;
3534
- }
3535
3876
 
3536
- .e-multiselect.e-rtl .e-multi-select-wrapper.e-down-icon .e-close-hooker::before {
3537
- left: -7px;
3538
- }
3539
3877
 
3540
- .e-popup.e-multi-select-list-wrapper .e-list-item .e-checkbox-wrapper {
3541
- bottom: 1px;
3542
- margin-right: 8px;
3543
- position: relative;
3544
- text-indent: 0;
3545
- vertical-align: middle;
3546
- }
3547
3878
 
3548
- .e-popup.e-multi-select-list-wrapper.e-multiselect-group:not(.e-rtl) .e-list-item .e-checkbox-wrapper {
3549
- padding-left: 14px;
3550
- }
3551
3879
 
3552
- .e-popup.e-multi-select-list-wrapper.e-multiselect-group.e-rtl .e-list-item .e-checkbox-wrapper {
3553
- padding-right: 25px;
3554
- }
3555
-
3556
- .e-popup.e-multi-select-list-wrapper.e-multiselect-group .e-list-group-item .e-checkbox-wrapper {
3557
- bottom: 1px;
3558
- margin-right: 8px;
3559
- position: relative;
3560
- text-indent: 0;
3561
- vertical-align: middle;
3562
- }
3563
-
3564
- .e-popup.e-multi-select-list-wrapper.e-rtl .e-list-item .e-checkbox-wrapper {
3565
- margin-left: 12px;
3566
- margin-right: 0;
3567
- }
3880
+ /* Font Family */
3881
+ /* Font Sizes */
3882
+ /* Radius */
3883
+ /* 1px */
3884
+ /* 2px */
3885
+ /* 3px */
3886
+ /* 4px */
3887
+ /* 5px */
3888
+ /* 6px */
3889
+ /* 7px */
3890
+ /* 8px */
3891
+ /* 9px */
3892
+ /* 10px */
3893
+ /* 11px */
3894
+ /* 12px */
3895
+ /* 13px */
3896
+ /* 14px */
3897
+ /* 15px */
3898
+ /* 16px */
3899
+ /* 17px */
3900
+ /* 18px */
3901
+ /* 19px */
3902
+ /* 20px */
3903
+ /* 21px */
3904
+ /* 22px */
3905
+ /* 23px */
3906
+ /* 24px */
3907
+ /* 25px */
3908
+ /* 26px */
3909
+ /* 27px */
3910
+ /* 28px */
3911
+ /* 29px */
3912
+ /* 30px */
3913
+ /* 31px */
3914
+ /* 32px */
3915
+ /* 33px */
3916
+ /* 34px */
3917
+ /* 35px */
3918
+ /* 36px */
3919
+ /* 37px */
3920
+ /* 38px */
3921
+ /* 39px */
3922
+ /* 40px */
3923
+ /* 41px */
3924
+ /* 42px */
3925
+ /* 43px */
3926
+ /* 44px */
3927
+ /* 45px */
3928
+ /* 46px */
3929
+ /* 47px */
3930
+ /* 48px */
3931
+ /* 49px */
3932
+ /* 50px */
3933
+ /* 5em */
3934
+ /* 65% */
3935
+ /* border */
3936
+ /* 0px */
3937
+ /* 1px */
3938
+ /* 1.5px */
3939
+ /* 2px */
3940
+ /* 3px */
3941
+ /* 4px */
3942
+ /* 5px */
3943
+ /* 6px */
3944
+ /* 7px */
3945
+ /* 8px */
3946
+ /* 9px */
3947
+ /* 10px */
3948
+ /* 11px */
3949
+ /* 12px */
3950
+ /* 13px */
3951
+ /* 14px */
3952
+ /* 15px */
3953
+ /* 16px */
3568
3954
 
3569
- .e-popup.e-multi-select-list-wrapper.e-multiselect-group.e-rtl .e-list-group-item .e-checkbox-wrapper {
3570
- margin-left: 12px;
3571
- margin-right: 0;
3572
- }
3573
3955
 
3574
- .e-popup.e-multi-select-list-wrapper.e-rtl .e-list-item {
3575
- padding-right: 0;
3576
- }
3577
3956
 
3578
- .e-popup.e-multi-select-list-wrapper.e-rtl .e-dropdownbase.e-rtl.e-dd-group .e-list-item {
3579
- padding-right: 15px;
3580
- }
3581
3957
 
3582
- .e-multi-select-list-wrapper .e-selectall-parent {
3958
+ /* stylelint-disable property-no-vendor-prefix */
3959
+ .e-listbox-wrapper,
3960
+ .e-listbox-container,
3961
+ .e-listboxtool-wrapper {
3962
+ -webkit-overflow-scrolling: touch;
3963
+ -webkit-box-sizing: border-box;
3964
+ box-sizing: border-box;
3583
3965
  cursor: pointer;
3584
3966
  display: block;
3585
- line-height: 30px;
3586
- overflow: hidden;
3587
- text-overflow: ellipsis;
3588
- padding-right: 16px;
3589
3967
  position: relative;
3590
- text-indent: 12px;
3591
- white-space: nowrap;
3968
+ -webkit-user-select: none;
3969
+ -moz-user-select: none;
3970
+ -ms-user-select: none;
3971
+ user-select: none;
3592
3972
  width: 100%;
3593
3973
  }
3594
-
3595
- .e-rtl .e-multi-select-list-wrapper .e-selectall-parent,
3596
- .e-multi-select-list-wrapper.e-rtl .e-selectall-parent {
3597
- padding-left: 16px;
3598
- padding-right: 15px;
3599
- }
3600
-
3601
- .e-multi-select-list-wrapper .e-selectall-parent .e-all-text {
3602
- color: var(--color-sf-content-text-color);
3603
- font-family: var(--e-font-family);
3604
- font-size: 14px;
3605
- }
3606
-
3607
- .e-multi-select-list-wrapper .e-selectall-parent .e-checkbox-wrapper {
3608
- bottom: 1px;
3609
- margin-right: 8px;
3610
- position: relative;
3611
- text-indent: 0;
3612
- vertical-align: middle;
3974
+ .e-listbox-wrapper *,
3975
+ .e-listbox-container *,
3976
+ .e-listboxtool-wrapper * {
3977
+ -webkit-box-sizing: border-box;
3978
+ box-sizing: border-box;
3613
3979
  }
3614
-
3615
- .e-multi-select-list-wrapper.e-rtl .e-selectall-parent .e-checkbox-wrapper {
3616
- margin-left: 12px;
3617
- margin-right: 0;
3980
+ .e-listbox-wrapper,
3981
+ .e-listbox-container,
3982
+ .e-listboxtool-wrapper {
3983
+ border-radius: calc(var(--e-radius) * 0.25);
3618
3984
  }
3619
-
3620
- .e-multiselect .e-input-group-icon.e-ddl-icon {
3621
- float: right;
3622
- margin-top: 0;
3985
+ .e-listbox-wrapper .e-list-wrap:focus-visible, .e-listbox-wrapper:focus,
3986
+ .e-listbox-container .e-list-wrap:focus-visible,
3987
+ .e-listbox-container:focus,
3988
+ .e-listboxtool-wrapper .e-list-wrap:focus-visible,
3989
+ .e-listboxtool-wrapper:focus {
3990
+ outline: none;
3623
3991
  }
3624
-
3625
- .e-multiselect.e-rtl .e-input-group-icon.e-ddl-icon {
3626
- float: left;
3992
+ .e-listbox-wrapper.e-disabled,
3993
+ .e-listbox-container.e-disabled,
3994
+ .e-listboxtool-wrapper.e-disabled {
3995
+ cursor: default;
3996
+ pointer-events: none;
3627
3997
  }
3628
-
3629
- .e-multiselect.e-control-wrapper.e-checkbox .e-multi-select-wrapper.e-down-icon {
3630
- padding-right: 0 48px 0 0;
3998
+ .e-listbox-wrapper .e-list-item.e-disabled, .e-listbox-wrapper .e-list-item.e-disabled .e-list-icon,
3999
+ .e-listbox-container .e-list-item.e-disabled,
4000
+ .e-listbox-container .e-list-item.e-disabled .e-list-icon,
4001
+ .e-listboxtool-wrapper .e-list-item.e-disabled,
4002
+ .e-listboxtool-wrapper .e-list-item.e-disabled .e-list-icon {
4003
+ color: var(--color-sf-content-text-color-disabled);
4004
+ opacity: 1;
3631
4005
  }
3632
-
3633
- .e-multiselect .e-multi-select-wrapper.e-down-icon {
3634
- padding: 1px 0;
4006
+ .e-listbox-wrapper:not(.e-list-template) .e-list-nrt,
4007
+ .e-listbox-container:not(.e-list-template) .e-list-nrt,
4008
+ .e-listboxtool-wrapper:not(.e-list-template) .e-list-nrt {
4009
+ text-align: center;
3635
4010
  }
3636
-
3637
- .e-ddl.e-popup.e-multi-select-list-wrapper .e-filter-parent .e-input-group:not(.e-control-container) .e-clear-icon {
3638
- padding-left: 8px;
4011
+ .e-listbox-wrapper .e-list-parent,
4012
+ .e-listbox-container .e-list-parent,
4013
+ .e-listboxtool-wrapper .e-list-parent {
4014
+ height: 100%;
4015
+ min-height: 32px;
3639
4016
  }
3640
-
3641
- .e-ddl.e-popup.e-multi-select-list-wrapper .e-filter-parent .e-back-icon {
3642
- padding: 0 8px;
4017
+ .e-listbox-wrapper .e-list-item,
4018
+ .e-listbox-container .e-list-item,
4019
+ .e-listboxtool-wrapper .e-list-item {
4020
+ border-bottom: 0 solid;
4021
+ outline: none;
3643
4022
  }
3644
-
3645
- .e-checkbox .e-multi-select-wrapper .e-delim-values .e-remain {
3646
- line-height: 20px;
3647
- padding-left: 10px;
4023
+ .e-listbox-wrapper .e-list-item:focus-visible,
4024
+ .e-listbox-container .e-list-item:focus-visible,
4025
+ .e-listboxtool-wrapper .e-list-item:focus-visible {
4026
+ background-color: var(--color-sf-content-bg-color) !important; /* stylelint-disable-line declaration-no-important */
4027
+ color: var(--color-sf-content-text-color) !important; /* stylelint-disable-line declaration-no-important */
4028
+ -webkit-box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px var(--color-sf-shadow-color1);
4029
+ box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px var(--color-sf-shadow-color1);
3648
4030
  }
3649
-
3650
- .e-popup.e-multi-select-list-wrapper .e-list-item.e-disable .e-checkbox-wrapper .e-frame,
3651
- .e-popup.e-multi-select-list-wrapper .e-list-group-item.e-disable .e-checkbox-wrapper .e-frame {
3652
- opacity: 0.3;
4031
+ .e-listbox-wrapper .e-list-item.e-disabled,
4032
+ .e-listbox-container .e-list-item.e-disabled,
4033
+ .e-listboxtool-wrapper .e-list-item.e-disabled {
4034
+ pointer-events: none;
3653
4035
  }
3654
-
3655
- .e-popup.e-multi-select-list-wrapper .e-list-item.e-disable,
3656
- .e-popup.e-multi-select-list-wrapper.e-multiselect-group.e-checkbox .e-list-group-item.e-disable {
4036
+ .e-listbox-wrapper .e-disable,
4037
+ .e-listbox-container .e-disable,
4038
+ .e-listboxtool-wrapper .e-disable {
3657
4039
  opacity: 0.7;
3658
4040
  }
3659
-
3660
- .e-multi-select-wrapper input[readonly=true] {
3661
- pointer-events: none;
3662
- }
3663
-
3664
- .e-multiselect.e-checkbox .e-multi-select-wrapper .e-searcher {
3665
- pointer-events: none;
4041
+ .e-listbox-wrapper .e-list-group-item, .e-listbox-wrapper .e-list-item,
4042
+ .e-listbox-container .e-list-group-item,
4043
+ .e-listbox-container .e-list-item,
4044
+ .e-listboxtool-wrapper .e-list-group-item,
4045
+ .e-listboxtool-wrapper .e-list-item {
4046
+ margin: 4px;
3666
4047
  }
3667
-
3668
- ejs-multiselect {
3669
- display: block;
4048
+ .e-listbox-wrapper .e-list-parent,
4049
+ .e-listbox-container .e-list-parent,
4050
+ .e-listboxtool-wrapper .e-list-parent {
4051
+ margin: 0;
4052
+ padding: 0;
3670
4053
  }
3671
-
3672
- .e-small.e-multi-select-list-wrapper .e-selectall-parent,
3673
- .e-small .e-multi-select-list-wrapper .e-selectall-parent {
3674
- line-height: 24px;
4054
+ .e-listbox-wrapper .e-list-header .e-text.header, .e-listbox-wrapper .e-list-header .e-headertemplate-text.nested-header,
4055
+ .e-listbox-container .e-list-header .e-text.header,
4056
+ .e-listbox-container .e-list-header .e-headertemplate-text.nested-header,
4057
+ .e-listboxtool-wrapper .e-list-header .e-text.header,
4058
+ .e-listboxtool-wrapper .e-list-header .e-headertemplate-text.nested-header {
4059
+ display: none;
3675
4060
  }
3676
-
3677
- .e-small .e-multi-select-wrapper .e-chips-close {
3678
- height: 14px;
3679
- width: 14px;
4061
+ .e-listbox-wrapper .e-icon-back,
4062
+ .e-listbox-container .e-icon-back,
4063
+ .e-listboxtool-wrapper .e-icon-back {
4064
+ margin-top: 2px;
3680
4065
  }
3681
-
3682
- .e-small .e-multi-select-wrapper {
3683
- min-height: 24px;
4066
+ .e-listbox-wrapper .e-list-header,
4067
+ .e-listbox-container .e-list-header,
4068
+ .e-listboxtool-wrapper .e-list-header {
4069
+ -webkit-box-align: center;
4070
+ -ms-flex-align: center;
4071
+ align-items: center;
4072
+ border-bottom: 1px solid;
4073
+ display: -webkit-box;
4074
+ display: -ms-flexbox;
4075
+ display: flex;
4076
+ font-weight: 500;
4077
+ height: 18px;
4078
+ padding: 12px;
3684
4079
  }
3685
-
3686
- .e-small .e-multi-select-wrapper input[type=text] {
3687
- height: 24px;
3688
- min-height: 24px;
4080
+ .e-listbox-wrapper .e-has-header > .e-view,
4081
+ .e-listbox-container .e-has-header > .e-view,
4082
+ .e-listboxtool-wrapper .e-has-header > .e-view {
4083
+ top: 45px;
3689
4084
  }
3690
-
3691
- .e-small .e-multi-select-wrapper .e-delim-values {
3692
- font-size: 12px;
3693
- line-height: 24px;
4085
+ .e-listbox-wrapper .e-but-back,
4086
+ .e-listbox-container .e-but-back,
4087
+ .e-listboxtool-wrapper .e-but-back {
4088
+ cursor: pointer;
4089
+ padding-right: 8px;
3694
4090
  }
3695
-
3696
- .e-small.e-multiselect.e-control-container .e-multi-select-wrapper .e-ddl-icon,
3697
- .e-small.e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-ddl-icon {
3698
- margin-top: -1.3em;
4091
+ .e-listbox-wrapper .e-list-group-item:first-child,
4092
+ .e-listbox-container .e-list-group-item:first-child,
4093
+ .e-listboxtool-wrapper .e-list-group-item:first-child {
4094
+ border: 0;
4095
+ border-bottom: 0 solid transparent;
3699
4096
  }
3700
-
3701
- .e-content-placeholder.e-multiselect.e-placeholder-multiselect {
3702
- background-size: 300px 33px;
3703
- min-height: 33px;
4097
+ .e-listbox-wrapper .e-list-group-item,
4098
+ .e-listbox-container .e-list-group-item,
4099
+ .e-listboxtool-wrapper .e-list-group-item {
4100
+ border-bottom: 0 solid transparent;
4101
+ border-top: 1px solid;
4102
+ font-weight: 600;
4103
+ height: 32px;
4104
+ line-height: 15px;
4105
+ padding: 6px 12px;
3704
4106
  }
3705
-
3706
- .e-multiselect.e-outline .e-multi-select-wrapper input[type=text] {
3707
- color: inherit;
4107
+ .e-listbox-wrapper .e-icon-collapsible,
4108
+ .e-listbox-container .e-icon-collapsible,
4109
+ .e-listboxtool-wrapper .e-icon-collapsible {
4110
+ cursor: pointer;
4111
+ font-size: 12px;
4112
+ position: absolute;
4113
+ right: 0;
4114
+ top: 50%;
4115
+ -webkit-transform: translateY(-50%);
4116
+ transform: translateY(-50%);
3708
4117
  }
3709
-
3710
- .e-multiselect.e-outline .e-multi-select-wrapper .e-chips-close.e-close-hooker,
3711
- .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon {
3712
- -webkit-box-align: normal;
3713
- -ms-flex-align: normal;
3714
- align-items: normal;
4118
+ .e-listbox-wrapper .e-text-content,
4119
+ .e-listbox-container .e-text-content,
4120
+ .e-listboxtool-wrapper .e-text-content {
4121
+ height: 100%;
4122
+ position: relative;
4123
+ vertical-align: middle;
3715
4124
  }
3716
-
3717
- .e-filled.e-multiselect:not(.e-float-input) .e-multi-select-wrapper {
3718
- padding: 0 12px 0 8px;
4125
+ .e-listbox-wrapper .e-text-content *,
4126
+ .e-listbox-container .e-text-content *,
4127
+ .e-listboxtool-wrapper .e-text-content * {
4128
+ display: inline-block;
4129
+ vertical-align: middle;
3719
4130
  }
3720
-
3721
- .e-multiselect.e-filled.e-input-group.e-control-wrapper {
3722
- padding: 0;
4131
+ .e-listbox-wrapper .e-text-content.e-checkbox .e-list-text,
4132
+ .e-listbox-container .e-text-content.e-checkbox .e-list-text,
4133
+ .e-listboxtool-wrapper .e-text-content.e-checkbox .e-list-text {
4134
+ width: calc(100% - 40px);
3723
4135
  }
3724
-
3725
- .e-filled.e-float-input .e-multi-select-wrapper {
3726
- padding: 11px 12px 0;
4136
+ .e-listbox-wrapper .e-text-content.e-checkbox.e-checkbox-left .e-list-icon + .e-list-text,
4137
+ .e-listbox-container .e-text-content.e-checkbox.e-checkbox-left .e-list-icon + .e-list-text,
4138
+ .e-listboxtool-wrapper .e-text-content.e-checkbox.e-checkbox-left .e-list-icon + .e-list-text {
4139
+ width: calc(100% - 90px);
3727
4140
  }
3728
-
3729
- .e-small.e-filled.e-float-input .e-multi-select-wrapper,
3730
- .e-small .e-filled.e-float-input .e-multi-select-wrapper {
3731
- padding: 12px 12px 0 8px;
4141
+ .e-listbox-wrapper .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text,
4142
+ .e-listbox-container .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text,
4143
+ .e-listboxtool-wrapper .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text {
4144
+ width: calc(100% - 80px);
3732
4145
  }
3733
-
3734
- .e-rtl.e-multiselect.e-filled.e-input-group.e-control-wrapper,
3735
- .e-rtl.e-multiselect.e-filled.e-float-input.e-control-wrapper {
3736
- padding: 0;
4146
+ .e-listbox-wrapper .e-list-item.e-checklist.e-has-child .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text,
4147
+ .e-listbox-container .e-list-item.e-checklist.e-has-child .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text,
4148
+ .e-listboxtool-wrapper .e-list-item.e-checklist.e-has-child .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text {
4149
+ width: calc(100% - 92px);
3737
4150
  }
3738
-
3739
- .e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips {
3740
- height: 28px;
4151
+ .e-listbox-wrapper .e-checkbox .e-checkbox-left,
4152
+ .e-listbox-container .e-checkbox .e-checkbox-left,
4153
+ .e-listboxtool-wrapper .e-checkbox .e-checkbox-left {
4154
+ margin: 0;
3741
4155
  }
3742
-
3743
- .e-small.e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips,
3744
- .e-small .e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips,
3745
- .e-multiselect.e-filled.e-float-input .e-multi-select-wrapper.e-mob-wrapper .e-chips.e-mob-chip,
3746
- .e-small .e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips,
3747
- .e-small.e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips {
3748
- height: 24px;
4156
+ .e-listbox-wrapper .e-checkbox .e-checkbox-right,
4157
+ .e-listbox-container .e-checkbox .e-checkbox-right,
4158
+ .e-listboxtool-wrapper .e-checkbox .e-checkbox-right {
4159
+ margin: -2px 0 0 8px;
3749
4160
  }
3750
-
3751
- .e-filled.e-float-input .e-multi-select-wrapper .e-chips {
3752
- height: 18px;
4161
+ .e-listbox-wrapper .e-list-text,
4162
+ .e-listbox-container .e-list-text,
4163
+ .e-listboxtool-wrapper .e-list-text {
4164
+ cursor: pointer;
4165
+ display: inline-block;
4166
+ overflow: hidden;
4167
+ text-overflow: ellipsis;
4168
+ vertical-align: top;
4169
+ white-space: nowrap;
4170
+ width: 100%;
3753
4171
  }
3754
-
3755
- .e-filled.e-float-input .e-multi-select-wrapper .e-chips,
3756
- .e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips {
3757
- margin: 8px 8px 0 0;
3758
- padding: 0 8px;
4172
+ .e-listbox-wrapper .e-list-icon + .e-list-text, .e-listbox-wrapper .e-icon-wrapper .e-list-text, .e-listbox-wrapper .e-icon-wrapper.e-text-content.e-checkbox .e-list-text,
4173
+ .e-listbox-container .e-list-icon + .e-list-text,
4174
+ .e-listbox-container .e-icon-wrapper .e-list-text,
4175
+ .e-listbox-container .e-icon-wrapper.e-text-content.e-checkbox .e-list-text,
4176
+ .e-listboxtool-wrapper .e-list-icon + .e-list-text,
4177
+ .e-listboxtool-wrapper .e-icon-wrapper .e-list-text,
4178
+ .e-listboxtool-wrapper .e-icon-wrapper.e-text-content.e-checkbox .e-list-text {
4179
+ width: calc(100% - 60px);
3759
4180
  }
3760
-
3761
- .e-rtl.e-filled.e-float-input .e-multi-select-wrapper .e-chips,
3762
- .e-rtl.e-filled:not(.e-float-input) .e-multi-select-wrapper .e-chips {
3763
- margin: 8px 0 0 8px;
3764
- padding: 0 8px;
4181
+ .e-listbox-wrapper .e-list-icon,
4182
+ .e-listbox-container .e-list-icon,
4183
+ .e-listboxtool-wrapper .e-list-icon {
4184
+ height: 30px;
4185
+ margin-right: 16px;
4186
+ width: 30px;
3765
4187
  }
3766
-
3767
- .e-small .e-filled .e-multi-select-wrapper .e-chips,
3768
- .e-small.e-filled .e-multi-select-wrapper .e-chips {
3769
- height: 16px 16px;
3770
- margin: 4px 4px 0 0;
3771
- padding-right: 8px;
4188
+ .e-listbox-wrapper .e-content,
4189
+ .e-listbox-container .e-content,
4190
+ .e-listboxtool-wrapper .e-content {
4191
+ overflow: hidden;
4192
+ position: relative;
3772
4193
  }
3773
-
3774
- .e.rtl.e-small .e-filled.e-float-input .e-multi-select-wrapper .e-chips,
3775
- .e-rtl.e-small.e-filled.e-float-input .e-multi-select-wrapper .e-chips {
3776
- margin: 4px 0 0 4px;
4194
+ .e-listbox-wrapper .e-list-header .e-text,
4195
+ .e-listbox-container .e-list-header .e-text,
4196
+ .e-listboxtool-wrapper .e-list-header .e-text {
4197
+ cursor: pointer;
4198
+ text-indent: 0;
3777
4199
  }
3778
-
3779
- .e-filled.e-multiselect:not(.e-float-input) .e-multi-select-wrapper .e-chips > .e-chipcontent {
3780
- font-size: 13px;
3781
- padding: 0 8px 0 0;
4200
+ .e-listbox-wrapper .e-text .e-headertext,
4201
+ .e-listbox-container .e-text .e-headertext,
4202
+ .e-listboxtool-wrapper .e-text .e-headertext {
4203
+ display: inline-block;
4204
+ line-height: 18px;
3782
4205
  }
3783
-
3784
- .e-small.e-filled.e-multiselect .e-multi-select-wrapper .e-chips > .e-chipcontent,
3785
- .e-small .e-filled.e-multiselect .e-multi-select-wrapper .e-chips > .e-chipcontent {
3786
- font-size: 12px;
4206
+ .e-listbox-wrapper.e-rtl,
4207
+ .e-listbox-container.e-rtl,
4208
+ .e-listboxtool-wrapper.e-rtl {
4209
+ direction: rtl;
3787
4210
  }
3788
-
3789
- .e-filled.e-float-input.e-multiselect .e-multi-select-wrapper .e-chips > .e-chipcontent {
3790
- font-size: 12px;
3791
- padding: 0 4px 0 0;
4211
+ .e-listbox-wrapper.e-rtl .e-list-icon,
4212
+ .e-listbox-container.e-rtl .e-list-icon,
4213
+ .e-listboxtool-wrapper.e-rtl .e-list-icon {
4214
+ margin-left: 16px;
4215
+ margin-right: 0;
3792
4216
  }
3793
-
3794
- .e-rtl.e-filled.e-multiselect .e-multi-select-wrapper .e-chips > .e-chipcontent {
3795
- padding: 0 0 0 4px;
4217
+ .e-listbox-wrapper.e-rtl .e-icon-collapsible,
4218
+ .e-listbox-container.e-rtl .e-icon-collapsible,
4219
+ .e-listboxtool-wrapper.e-rtl .e-icon-collapsible {
4220
+ left: 0;
4221
+ right: initial;
4222
+ top: 50%;
4223
+ -webkit-transform: translateY(-50%) rotate(180deg);
4224
+ transform: translateY(-50%) rotate(180deg);
3796
4225
  }
3797
-
3798
- .e-small.e-filled.e-float-input.e-multiselect .e-multi-select-wrapper .e-chips > .e-chipcontent,
3799
- .e-small .e-filled.e-float-input.e-multiselect .e-multi-select-wrapper .e-chips > .e-chipcontent {
3800
- font-size: 10px;
4226
+ .e-listbox-wrapper.e-rtl .e-list-header .e-text,
4227
+ .e-listbox-container.e-rtl .e-list-header .e-text,
4228
+ .e-listboxtool-wrapper.e-rtl .e-list-header .e-text {
4229
+ cursor: pointer;
3801
4230
  }
3802
-
3803
- .e-filled.e-multiselect.e-float-input .e-multi-select-wrapper.e-mob-wrapper .e-chips > .e-chipcontent {
3804
- font-size: 13px;
3805
- padding-right: 4px;
4231
+ .e-listbox-wrapper.e-rtl .e-but-back,
4232
+ .e-listbox-container.e-rtl .e-but-back,
4233
+ .e-listboxtool-wrapper.e-rtl .e-but-back {
4234
+ -webkit-transform: rotate(180deg);
4235
+ transform: rotate(180deg);
3806
4236
  }
3807
-
3808
- .e-filled.e-multi-select-wrapper .e-chips-close.e-close-hooker,
3809
- .e-multiselect.e-control-container .e-filled.e-multi-select-wrapper .e-clear-icon {
3810
- height: 38px;
3811
- margin-top: -38px;
3812
- right: 12px;
3813
- top: 100%;
3814
- width: 16px;
4237
+ .e-listbox-wrapper.e-rtl .e-icon-back,
4238
+ .e-listbox-container.e-rtl .e-icon-back,
4239
+ .e-listboxtool-wrapper.e-rtl .e-icon-back {
4240
+ margin-top: -2px;
3815
4241
  }
3816
-
3817
- .e-multiselect.e-control-wrapper.e-input-group.e-readonly .e-clear-icon,
3818
- .e-outline.e-multiselect.e-control-wrapper.e-input-group.e-readonly .e-clear-icon,
3819
- .e-filled.e-multiselect.e-control-wrapper.e-input-group.e-readonly .e-clear-icon,
3820
- .e-multiselect.e-readonly.e-control-wrapper.e-input-group.e-control-container :not(.e-disabled).e-multi-select-wrapper:hover .e-clear-icon,
3821
- .e-multiselect.e-readonly.e-control-wrapper.e-input-group.e-control-container.e-input-group :not(.e-disabled).e-multi-select-wrapper:hover .e-clear-icon {
3822
- display: none;
4242
+ .e-listbox-wrapper.e-rtl .e-checkbox .e-checkbox-left,
4243
+ .e-listbox-wrapper.e-rtl .e-checkbox-wrapper,
4244
+ .e-listbox-container.e-rtl .e-checkbox .e-checkbox-left,
4245
+ .e-listbox-container.e-rtl .e-checkbox-wrapper,
4246
+ .e-listboxtool-wrapper.e-rtl .e-checkbox .e-checkbox-left,
4247
+ .e-listboxtool-wrapper.e-rtl .e-checkbox-wrapper {
4248
+ margin: 0;
4249
+ padding: 2px 0 2px 12px;
4250
+ vertical-align: top;
3823
4251
  }
3824
-
3825
- .e-multiselect.e-input-group.e-control-wrapper .e-input-group-icon {
3826
- margin-right: 0;
4252
+ .e-listbox-wrapper.e-rtl .e-checkbox .e-checkbox-right,
4253
+ .e-listbox-container.e-rtl .e-checkbox .e-checkbox-right,
4254
+ .e-listboxtool-wrapper.e-rtl .e-checkbox .e-checkbox-right {
4255
+ margin: -2px 8px 0 0;
3827
4256
  }
3828
-
3829
- .e-multiselect.e-control-container.e-input-group.e-disabled .e-input-group-icon.e-ddl-icon.e-icons,
3830
- .e-multiselect.e-control-container.e-input-group.e-disabled .e-clear-icon {
3831
- cursor: not-allowed;
4257
+ .e-listbox-wrapper .e-checkbox-wrapper,
4258
+ .e-listbox-container .e-checkbox-wrapper,
4259
+ .e-listboxtool-wrapper .e-checkbox-wrapper {
4260
+ margin: 0;
4261
+ text-indent: 0;
4262
+ vertical-align: middle;
4263
+ padding: 2px 12px 2px 0;
4264
+ vertical-align: top;
3832
4265
  }
3833
-
3834
- .e-multiselect.e-control-wrapper.e-control-container.e-input-group.e-checkbox .e-multi-select-wrapper.e-down-icon,
3835
- .e-multiselect.e-control-wrapper.e-control-container.e-input-group.e-checkbox .e-multi-select-wrapper.e-down-icon .e-multi-searcher .e-dropdownbase.e-control.e-multiselect.e-lib {
3836
- cursor: pointer;
4266
+ .e-listbox-wrapper .e-checkbox-wrapper .e-frame,
4267
+ .e-listbox-container .e-checkbox-wrapper .e-frame,
4268
+ .e-listboxtool-wrapper .e-checkbox-wrapper .e-frame {
4269
+ margin: 0 !important; /* stylelint-disable-line declaration-no-important */
3837
4270
  }
3838
-
3839
- .e-popup.e-multi-select-list-wrapper.e-resize .e-resizer-right {
3840
- bottom: 0;
4271
+ .e-listbox-wrapper.e-checkbox-right .e-checkbox-wrapper,
4272
+ .e-listbox-container.e-checkbox-right .e-checkbox-wrapper,
4273
+ .e-listboxtool-wrapper.e-checkbox-right .e-checkbox-wrapper {
4274
+ position: absolute;
3841
4275
  right: 0;
3842
- cursor: nwse-resize;
3843
- height: 15px;
4276
+ top: 30%;
4277
+ }
4278
+ .e-listbox-wrapper .e-input-group,
4279
+ .e-listbox-container .e-input-group,
4280
+ .e-listboxtool-wrapper .e-input-group {
4281
+ padding: 4px 8px;
4282
+ }
4283
+ .e-listbox-wrapper .e-input-focus,
4284
+ .e-listbox-container .e-input-focus,
4285
+ .e-listboxtool-wrapper .e-input-focus {
4286
+ padding: 4px 4px 4px 8px;
4287
+ }
4288
+ .e-listbox-wrapper .e-hidden-select,
4289
+ .e-listbox-container .e-hidden-select,
4290
+ .e-listboxtool-wrapper .e-hidden-select {
4291
+ height: 1px;
4292
+ opacity: 0;
3844
4293
  position: absolute;
3845
- width: 15px;
4294
+ width: 100%;
4295
+ }
4296
+ .e-listbox-wrapper .e-placeholder,
4297
+ .e-listbox-container .e-placeholder,
4298
+ .e-listboxtool-wrapper .e-placeholder {
4299
+ background-color: var(--color-sf-primary-border-color);
4300
+ display: block;
4301
+ border: 2px solid var(--color-sf-primary-border-color);
4302
+ height: 1px;
3846
4303
  }
3847
4304
 
3848
- .e-listbox-tool .e-moveup::before {
3849
- content: "\e776";
4305
+ ejs-listbox {
4306
+ display: block;
3850
4307
  }
3851
4308
 
3852
- .e-listbox-tool .e-movedown::before {
3853
- content: "\e729";
4309
+ .e-listbox-wrapper:not(.e-listbox-container),
4310
+ .e-listbox-wrapper.e-filter-list .e-list-parent {
4311
+ overflow: auto;
3854
4312
  }
3855
4313
 
3856
- .e-listbox-tool .e-moveto::before {
3857
- content: "\e748";
4314
+ .e-listbox-wrapper.e-sortableclone,
4315
+ .e-listbox-container.e-sortableclone,
4316
+ .e-listboxtool-wrapper.e-sortableclone {
4317
+ border-width: 0;
4318
+ overflow: visible;
4319
+ }
4320
+ .e-listbox-wrapper.e-sortableclone .e-list-item,
4321
+ .e-listbox-container.e-sortableclone .e-list-item,
4322
+ .e-listboxtool-wrapper.e-sortableclone .e-list-item {
4323
+ list-style-type: none;
4324
+ }
4325
+ .e-listbox-wrapper.e-sortableclone .e-ripple,
4326
+ .e-listbox-container.e-sortableclone .e-ripple,
4327
+ .e-listboxtool-wrapper.e-sortableclone .e-ripple {
4328
+ overflow: visible;
4329
+ }
4330
+ .e-listbox-wrapper.e-sortableclone .e-ripple .e-ripple-element,
4331
+ .e-listbox-container.e-sortableclone .e-ripple .e-ripple-element,
4332
+ .e-listboxtool-wrapper.e-sortableclone .e-ripple .e-ripple-element {
4333
+ display: none;
4334
+ }
4335
+ .e-listbox-wrapper.e-sortableclone .e-list-badge,
4336
+ .e-listbox-container.e-sortableclone .e-list-badge,
4337
+ .e-listboxtool-wrapper.e-sortableclone .e-list-badge {
4338
+ -webkit-box-align: center;
4339
+ -ms-flex-align: center;
4340
+ align-items: center;
4341
+ background-color: var(--color-sf-primary-border-color);
4342
+ border: 1px solid var(--color-sf-primary-text-color);
4343
+ border-radius: 999px;
4344
+ color: var(--color-sf-primary-text-color);
4345
+ display: -webkit-box;
4346
+ display: -ms-flexbox;
4347
+ display: flex;
4348
+ font-size: 12px;
4349
+ height: 22px;
4350
+ -webkit-box-pack: center;
4351
+ -ms-flex-pack: center;
4352
+ justify-content: center;
4353
+ position: absolute;
4354
+ right: -10px;
4355
+ top: -10px;
4356
+ width: 22px;
3858
4357
  }
3859
4358
 
3860
- .e-listbox-tool .e-movefrom::before {
3861
- content: "\e765";
4359
+ .e-listboxtool-wrapper.e-sortableclone {
4360
+ display: block;
3862
4361
  }
3863
4362
 
3864
- .e-listbox-tool .e-moveallto::before {
3865
- content: "\e7a9";
4363
+ .e-listboxtool-wrapper,
4364
+ .e-listboxtool-container {
4365
+ cursor: pointer;
4366
+ display: -webkit-box;
4367
+ display: -ms-flexbox;
4368
+ display: flex;
4369
+ }
4370
+ .e-listboxtool-wrapper *,
4371
+ .e-listboxtool-container * {
4372
+ -webkit-box-sizing: border-box;
4373
+ box-sizing: border-box;
4374
+ }
4375
+ .e-listboxtool-wrapper.e-disabled,
4376
+ .e-listboxtool-container.e-disabled {
4377
+ cursor: default;
4378
+ pointer-events: none;
4379
+ }
4380
+ .e-listboxtool-wrapper .e-listbox-wrapper,
4381
+ .e-listboxtool-wrapper .e-list-wrap,
4382
+ .e-listboxtool-container .e-listbox-wrapper,
4383
+ .e-listboxtool-container .e-list-wrap {
4384
+ -webkit-box-flex: 1;
4385
+ -ms-flex: 1;
4386
+ flex: 1;
4387
+ }
4388
+ .e-listboxtool-wrapper.e-right .e-listbox-tool,
4389
+ .e-listboxtool-container.e-right .e-listbox-tool {
4390
+ margin-left: 15px;
4391
+ }
4392
+ .e-listboxtool-wrapper.e-left .e-listbox-tool,
4393
+ .e-listboxtool-container.e-left .e-listbox-tool {
4394
+ margin-right: 15px;
4395
+ }
4396
+ .e-listboxtool-wrapper .e-listbox-tool,
4397
+ .e-listboxtool-container .e-listbox-tool {
4398
+ border: 1px solid var(--color-sf-border-light);
4399
+ overflow: auto;
4400
+ padding: 8px;
4401
+ }
4402
+ .e-listboxtool-wrapper .e-listbox-tool .e-btn,
4403
+ .e-listboxtool-container .e-listbox-tool .e-btn {
4404
+ display: list-item;
4405
+ list-style-type: none;
4406
+ margin-bottom: 10px;
4407
+ }
4408
+ .e-listboxtool-wrapper.e-checkbox-right .e-checkbox-wrapper,
4409
+ .e-listboxtool-container.e-checkbox-right .e-checkbox-wrapper {
4410
+ position: absolute;
4411
+ right: 0;
4412
+ top: 30%;
3866
4413
  }
3867
4414
 
3868
- .e-listbox-tool .e-moveallfrom::before {
3869
- content: "\e744";
4415
+ .e-rtl.e-listboxtool-wrapper.e-right .e-listbox-tool,
4416
+ .e-rtl.e-listboxtool-container.e-right .e-listbox-tool {
4417
+ margin-right: 15px;
4418
+ }
4419
+ .e-rtl.e-listboxtool-wrapper.e-left .e-listbox-tool,
4420
+ .e-rtl.e-listboxtool-container.e-left .e-listbox-tool {
4421
+ margin-left: 15px;
4422
+ }
4423
+
4424
+ .e-listbox-wrapper:not(.e-list-template) .e-list-item,
4425
+ .e-listbox-wrapper .e-list-nrt,
4426
+ .e-listbox-wrapper .e-selectall-parent,
4427
+ .e-listbox-container:not(.e-list-template) .e-list-item,
4428
+ .e-listbox-container .e-list-nrt,
4429
+ .e-listbox-container .e-selectall-parent,
4430
+ .e-listboxtool-wrapper .e-listbox-wrapper:not(.e-list-template) .e-list-item,
4431
+ .e-listboxtool-wrapper .e-listbox-wrapper .e-list-nrt,
4432
+ .e-listboxtool-wrapper .e-listbox-wrapper .e-selectall-parent {
4433
+ height: 32px;
4434
+ line-height: 20px;
4435
+ padding: 6px 12px;
4436
+ position: relative;
4437
+ font-size: 14px;
4438
+ border-radius: calc(var(--e-radius) * 0.25) !important; /* stylelint-disable-line declaration-no-important */
4439
+ }
4440
+ .e-listbox-wrapper .e-list-icon,
4441
+ .e-listbox-container .e-list-icon,
4442
+ .e-listboxtool-wrapper .e-listbox-wrapper .e-list-icon {
4443
+ display: inline;
4444
+ vertical-align: middle;
4445
+ width: auto;
4446
+ height: auto;
4447
+ padding-bottom: 1px;
3870
4448
  }
3871
4449
 
3872
4450
 
@@ -4105,748 +4683,170 @@ ejs-multiselect {
4105
4683
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content,
4106
4684
  .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content,
4107
4685
  .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content {
4108
- color: var(--color-sf-content-text-color-alt2);
4109
- display: block;
4110
- font-size: 14px;
4111
- margin: 0;
4112
- padding: 2px 0 0 0;
4113
- word-wrap: break-word;
4114
- }
4115
- .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content:not(.e-text-overflow),
4116
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content:not(.e-text-overflow),
4117
- .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content:not(.e-text-overflow) {
4118
- overflow: hidden;
4119
- text-overflow: ellipsis;
4120
- white-space: nowrap;
4121
- }
4122
- .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
4123
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
4124
- .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-avatar .e-avatar {
4125
- height: 40px;
4126
- left: 0;
4127
- position: absolute;
4128
- width: 40px;
4129
- left: 0;
4130
- }
4131
- .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge),
4132
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge),
4133
- .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge) {
4134
- padding-left: 68px;
4135
- padding-right: 16px;
4136
- }
4137
- .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge),
4138
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge),
4139
- .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) {
4140
- padding-left: 16px;
4141
- padding-right: 68px;
4142
- }
4143
- .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar,
4144
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar,
4145
- .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar {
4146
- height: 40px;
4147
- left: 0;
4148
- position: absolute;
4149
- width: 40px;
4150
- right: 0;
4151
- }
4152
- .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar .e-avatar, .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar-right:not(.e-list-badge) .e-avatar,
4153
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar .e-avatar,
4154
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar-right:not(.e-list-badge) .e-avatar,
4155
- .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar .e-avatar,
4156
- .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar-right:not(.e-list-badge) .e-avatar {
4157
- top: 0;
4158
- }
4159
- .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-badge .e-badge,
4160
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge .e-badge,
4161
- .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-badge .e-badge {
4162
- font-size: 10px;
4163
- height: 18px;
4164
- line-height: 16px;
4165
- padding: 0;
4166
- position: absolute;
4167
- right: 12px;
4168
- top: 50%;
4169
- -webkit-transform: translateY(-50%);
4170
- transform: translateY(-50%);
4171
- width: 32px;
4172
- }
4173
- .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar,
4174
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar,
4175
- .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar {
4176
- padding-left: 68px;
4177
- padding-right: 10px;
4178
- }
4179
- .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar),
4180
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar),
4181
- .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar) {
4182
- padding-left: 16px;
4183
- padding-right: 10px;
4184
- }
4185
- .e-listbox-wrapper.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content,
4186
- .e-listbox-container.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content,
4187
- .e-listboxtool-wrapper.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content {
4188
- display: block;
4189
- margin: 0;
4190
- overflow: hidden;
4191
- padding: 8px 0;
4192
- text-overflow: ellipsis;
4193
- white-space: nowrap;
4194
- }
4195
- .e-listbox-wrapper.e-list-template .e-list-item.e-list-item:hover .e-list-item-header, .e-listbox-wrapper.e-list-template .e-list-item.e-list-item:hover .e-list-content,
4196
- .e-listbox-container.e-list-template .e-list-item.e-list-item:hover .e-list-item-header,
4197
- .e-listbox-container.e-list-template .e-list-item.e-list-item:hover .e-list-content,
4198
- .e-listboxtool-wrapper.e-list-template .e-list-item.e-list-item:hover .e-list-item-header,
4199
- .e-listboxtool-wrapper.e-list-template .e-list-item.e-list-item:hover .e-list-content {
4200
- color: var(--color-sf-content-text-color-hover);
4201
- }
4202
- .e-listbox-wrapper.e-list-template .e-list-item.e-selected .e-list-item-header, .e-listbox-wrapper.e-list-template .e-list-item.e-selected .e-list-content,
4203
- .e-listbox-container.e-list-template .e-list-item.e-selected .e-list-item-header,
4204
- .e-listbox-container.e-list-template .e-list-item.e-selected .e-list-content,
4205
- .e-listboxtool-wrapper.e-list-template .e-list-item.e-selected .e-list-item-header,
4206
- .e-listboxtool-wrapper.e-list-template .e-list-item.e-selected .e-list-content {
4207
- color: var(--color-sf-content-text-color-selected);
4208
- }
4209
- .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
4210
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
4211
- .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar {
4212
- left: inherit;
4213
- right: 0;
4214
- }
4215
- .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge),
4216
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge),
4217
- .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge) {
4218
- padding-left: 16px;
4219
- padding-right: 68px;
4220
- }
4221
- .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge),
4222
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge),
4223
- .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) {
4224
- padding-left: 68px;
4225
- padding-right: 16px;
4226
- }
4227
- .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar,
4228
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar,
4229
- .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar {
4230
- left: 0;
4231
- right: inherit;
4232
- }
4233
- .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge .e-badge,
4234
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge .e-badge,
4235
- .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge .e-badge {
4236
- left: 12px;
4237
- right: inherit;
4238
- }
4239
- .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar,
4240
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar,
4241
- .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar {
4242
- padding-left: 10px;
4243
- padding-right: 68px;
4244
- }
4245
- .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar),
4246
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar),
4247
- .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar) {
4248
- padding-left: 10px;
4249
- padding-right: 16px;
4250
- }
4251
-
4252
- .e-listbox-wrapper.e-sortableclone .e-list-item,
4253
- .e-listbox-container.e-sortableclone .e-list-item {
4254
- background-color: var(--color-sf-content-bg-color-alt3) !important; /* stylelint-disable-line declaration-no-important */
4255
- color: var(--color-sf-content-text-color) !important; /* stylelint-disable-line declaration-no-important */
4256
- }
4257
-
4258
- .e-listbox-container.e-filter-list .e-list-parent, .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent, .e-listbox-container .e-selectall-parent + .e-list-parent {
4259
- height: 100%;
4260
- }
4261
-
4262
- .e-listbox-container.e-filter-list .e-list-wrap {
4263
- height: calc(100% - 50px) !important; /* stylelint-disable-line declaration-no-important */
4264
- }
4265
-
4266
- .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-wrap {
4267
- height: calc(100% - 38px) !important; /* stylelint-disable-line declaration-no-important */
4268
- }
4269
-
4270
- .e-listbox-container .e-selectall-parent + .e-list-wrap {
4271
- height: calc(100% - 38px) !important; /* stylelint-disable-line declaration-no-important */
4272
- }
4273
-
4274
-
4275
-
4276
-
4277
-
4278
-
4279
-
4280
-
4281
-
4282
- /* Font Family */
4283
- /* Font Sizes */
4284
- /* Radius */
4285
- /* 1px */
4286
- /* 2px */
4287
- /* 3px */
4288
- /* 4px */
4289
- /* 5px */
4290
- /* 6px */
4291
- /* 7px */
4292
- /* 8px */
4293
- /* 9px */
4294
- /* 10px */
4295
- /* 11px */
4296
- /* 12px */
4297
- /* 13px */
4298
- /* 14px */
4299
- /* 15px */
4300
- /* 16px */
4301
- /* 17px */
4302
- /* 18px */
4303
- /* 19px */
4304
- /* 20px */
4305
- /* 21px */
4306
- /* 22px */
4307
- /* 23px */
4308
- /* 24px */
4309
- /* 25px */
4310
- /* 26px */
4311
- /* 27px */
4312
- /* 28px */
4313
- /* 29px */
4314
- /* 30px */
4315
- /* 31px */
4316
- /* 32px */
4317
- /* 33px */
4318
- /* 34px */
4319
- /* 35px */
4320
- /* 36px */
4321
- /* 37px */
4322
- /* 38px */
4323
- /* 39px */
4324
- /* 40px */
4325
- /* 41px */
4326
- /* 42px */
4327
- /* 43px */
4328
- /* 44px */
4329
- /* 45px */
4330
- /* 46px */
4331
- /* 47px */
4332
- /* 48px */
4333
- /* 49px */
4334
- /* 50px */
4335
- /* 5em */
4336
- /* 65% */
4337
- /* border */
4338
- /* 0px */
4339
- /* 1px */
4340
- /* 1.5px */
4341
- /* 2px */
4342
- /* 3px */
4343
- /* 4px */
4344
- /* 5px */
4345
- /* 6px */
4346
- /* 7px */
4347
- /* 8px */
4348
- /* 9px */
4349
- /* 10px */
4350
- /* 11px */
4351
- /* 12px */
4352
- /* 13px */
4353
- /* 14px */
4354
- /* 15px */
4355
- /* 16px */
4356
-
4357
-
4358
-
4359
-
4360
- /* stylelint-disable property-no-vendor-prefix */
4361
- .e-listbox-wrapper,
4362
- .e-listbox-container,
4363
- .e-listboxtool-wrapper {
4364
- -webkit-overflow-scrolling: touch;
4365
- -webkit-box-sizing: border-box;
4366
- box-sizing: border-box;
4367
- cursor: pointer;
4368
- display: block;
4369
- position: relative;
4370
- -webkit-user-select: none;
4371
- -moz-user-select: none;
4372
- -ms-user-select: none;
4373
- user-select: none;
4374
- width: 100%;
4375
- }
4376
- .e-listbox-wrapper *,
4377
- .e-listbox-container *,
4378
- .e-listboxtool-wrapper * {
4379
- -webkit-box-sizing: border-box;
4380
- box-sizing: border-box;
4381
- }
4382
- .e-listbox-wrapper,
4383
- .e-listbox-container,
4384
- .e-listboxtool-wrapper {
4385
- border-radius: calc(var(--e-radius) * 0.25);
4386
- }
4387
- .e-listbox-wrapper .e-list-wrap:focus-visible, .e-listbox-wrapper:focus,
4388
- .e-listbox-container .e-list-wrap:focus-visible,
4389
- .e-listbox-container:focus,
4390
- .e-listboxtool-wrapper .e-list-wrap:focus-visible,
4391
- .e-listboxtool-wrapper:focus {
4392
- outline: none;
4393
- }
4394
- .e-listbox-wrapper.e-disabled,
4395
- .e-listbox-container.e-disabled,
4396
- .e-listboxtool-wrapper.e-disabled {
4397
- cursor: default;
4398
- pointer-events: none;
4399
- }
4400
- .e-listbox-wrapper .e-list-item.e-disabled, .e-listbox-wrapper .e-list-item.e-disabled .e-list-icon,
4401
- .e-listbox-container .e-list-item.e-disabled,
4402
- .e-listbox-container .e-list-item.e-disabled .e-list-icon,
4403
- .e-listboxtool-wrapper .e-list-item.e-disabled,
4404
- .e-listboxtool-wrapper .e-list-item.e-disabled .e-list-icon {
4405
- color: var(--color-sf-content-text-color-disabled);
4406
- opacity: 1;
4407
- }
4408
- .e-listbox-wrapper:not(.e-list-template) .e-list-nrt,
4409
- .e-listbox-container:not(.e-list-template) .e-list-nrt,
4410
- .e-listboxtool-wrapper:not(.e-list-template) .e-list-nrt {
4411
- text-align: center;
4412
- }
4413
- .e-listbox-wrapper .e-list-parent,
4414
- .e-listbox-container .e-list-parent,
4415
- .e-listboxtool-wrapper .e-list-parent {
4416
- height: 100%;
4417
- min-height: 32px;
4418
- }
4419
- .e-listbox-wrapper .e-list-item,
4420
- .e-listbox-container .e-list-item,
4421
- .e-listboxtool-wrapper .e-list-item {
4422
- border-bottom: 0 solid;
4423
- outline: none;
4424
- }
4425
- .e-listbox-wrapper .e-list-item:focus-visible,
4426
- .e-listbox-container .e-list-item:focus-visible,
4427
- .e-listboxtool-wrapper .e-list-item:focus-visible {
4428
- background-color: var(--color-sf-content-bg-color) !important; /* stylelint-disable-line declaration-no-important */
4429
- color: var(--color-sf-content-text-color) !important; /* stylelint-disable-line declaration-no-important */
4430
- -webkit-box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px var(--color-sf-shadow-color1);
4431
- box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px var(--color-sf-shadow-color1);
4432
- }
4433
- .e-listbox-wrapper .e-list-item.e-disabled,
4434
- .e-listbox-container .e-list-item.e-disabled,
4435
- .e-listboxtool-wrapper .e-list-item.e-disabled {
4436
- pointer-events: none;
4437
- }
4438
- .e-listbox-wrapper .e-disable,
4439
- .e-listbox-container .e-disable,
4440
- .e-listboxtool-wrapper .e-disable {
4441
- opacity: 0.7;
4442
- }
4443
- .e-listbox-wrapper .e-list-group-item, .e-listbox-wrapper .e-list-item,
4444
- .e-listbox-container .e-list-group-item,
4445
- .e-listbox-container .e-list-item,
4446
- .e-listboxtool-wrapper .e-list-group-item,
4447
- .e-listboxtool-wrapper .e-list-item {
4448
- margin: 4px;
4449
- }
4450
- .e-listbox-wrapper .e-list-parent,
4451
- .e-listbox-container .e-list-parent,
4452
- .e-listboxtool-wrapper .e-list-parent {
4453
- margin: 0;
4454
- padding: 0;
4455
- }
4456
- .e-listbox-wrapper .e-list-header .e-text.header, .e-listbox-wrapper .e-list-header .e-headertemplate-text.nested-header,
4457
- .e-listbox-container .e-list-header .e-text.header,
4458
- .e-listbox-container .e-list-header .e-headertemplate-text.nested-header,
4459
- .e-listboxtool-wrapper .e-list-header .e-text.header,
4460
- .e-listboxtool-wrapper .e-list-header .e-headertemplate-text.nested-header {
4461
- display: none;
4462
- }
4463
- .e-listbox-wrapper .e-icon-back,
4464
- .e-listbox-container .e-icon-back,
4465
- .e-listboxtool-wrapper .e-icon-back {
4466
- margin-top: 2px;
4467
- }
4468
- .e-listbox-wrapper .e-list-header,
4469
- .e-listbox-container .e-list-header,
4470
- .e-listboxtool-wrapper .e-list-header {
4471
- -webkit-box-align: center;
4472
- -ms-flex-align: center;
4473
- align-items: center;
4474
- border-bottom: 1px solid;
4475
- display: -webkit-box;
4476
- display: -ms-flexbox;
4477
- display: flex;
4478
- font-weight: 500;
4479
- height: 18px;
4480
- padding: 12px;
4481
- }
4482
- .e-listbox-wrapper .e-has-header > .e-view,
4483
- .e-listbox-container .e-has-header > .e-view,
4484
- .e-listboxtool-wrapper .e-has-header > .e-view {
4485
- top: 45px;
4486
- }
4487
- .e-listbox-wrapper .e-but-back,
4488
- .e-listbox-container .e-but-back,
4489
- .e-listboxtool-wrapper .e-but-back {
4490
- cursor: pointer;
4491
- padding-right: 8px;
4492
- }
4493
- .e-listbox-wrapper .e-list-group-item:first-child,
4494
- .e-listbox-container .e-list-group-item:first-child,
4495
- .e-listboxtool-wrapper .e-list-group-item:first-child {
4496
- border: 0;
4497
- border-bottom: 0 solid transparent;
4498
- }
4499
- .e-listbox-wrapper .e-list-group-item,
4500
- .e-listbox-container .e-list-group-item,
4501
- .e-listboxtool-wrapper .e-list-group-item {
4502
- border-bottom: 0 solid transparent;
4503
- border-top: 1px solid;
4504
- font-weight: 600;
4505
- height: 32px;
4506
- line-height: 15px;
4507
- padding: 6px 12px;
4508
- }
4509
- .e-listbox-wrapper .e-icon-collapsible,
4510
- .e-listbox-container .e-icon-collapsible,
4511
- .e-listboxtool-wrapper .e-icon-collapsible {
4512
- cursor: pointer;
4513
- font-size: 12px;
4514
- position: absolute;
4515
- right: 0;
4516
- top: 50%;
4517
- -webkit-transform: translateY(-50%);
4518
- transform: translateY(-50%);
4519
- }
4520
- .e-listbox-wrapper .e-text-content,
4521
- .e-listbox-container .e-text-content,
4522
- .e-listboxtool-wrapper .e-text-content {
4523
- height: 100%;
4524
- position: relative;
4525
- vertical-align: middle;
4526
- }
4527
- .e-listbox-wrapper .e-text-content *,
4528
- .e-listbox-container .e-text-content *,
4529
- .e-listboxtool-wrapper .e-text-content * {
4530
- display: inline-block;
4531
- vertical-align: middle;
4532
- }
4533
- .e-listbox-wrapper .e-text-content.e-checkbox .e-list-text,
4534
- .e-listbox-container .e-text-content.e-checkbox .e-list-text,
4535
- .e-listboxtool-wrapper .e-text-content.e-checkbox .e-list-text {
4536
- width: calc(100% - 40px);
4537
- }
4538
- .e-listbox-wrapper .e-text-content.e-checkbox.e-checkbox-left .e-list-icon + .e-list-text,
4539
- .e-listbox-container .e-text-content.e-checkbox.e-checkbox-left .e-list-icon + .e-list-text,
4540
- .e-listboxtool-wrapper .e-text-content.e-checkbox.e-checkbox-left .e-list-icon + .e-list-text {
4541
- width: calc(100% - 90px);
4542
- }
4543
- .e-listbox-wrapper .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text,
4544
- .e-listbox-container .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text,
4545
- .e-listboxtool-wrapper .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text {
4546
- width: calc(100% - 80px);
4547
- }
4548
- .e-listbox-wrapper .e-list-item.e-checklist.e-has-child .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text,
4549
- .e-listbox-container .e-list-item.e-checklist.e-has-child .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text,
4550
- .e-listboxtool-wrapper .e-list-item.e-checklist.e-has-child .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text {
4551
- width: calc(100% - 92px);
4552
- }
4553
- .e-listbox-wrapper .e-checkbox .e-checkbox-left,
4554
- .e-listbox-container .e-checkbox .e-checkbox-left,
4555
- .e-listboxtool-wrapper .e-checkbox .e-checkbox-left {
4556
- margin: 0;
4557
- }
4558
- .e-listbox-wrapper .e-checkbox .e-checkbox-right,
4559
- .e-listbox-container .e-checkbox .e-checkbox-right,
4560
- .e-listboxtool-wrapper .e-checkbox .e-checkbox-right {
4561
- margin: -2px 0 0 8px;
4562
- }
4563
- .e-listbox-wrapper .e-list-text,
4564
- .e-listbox-container .e-list-text,
4565
- .e-listboxtool-wrapper .e-list-text {
4566
- cursor: pointer;
4567
- display: inline-block;
4568
- overflow: hidden;
4569
- text-overflow: ellipsis;
4570
- vertical-align: top;
4571
- white-space: nowrap;
4572
- width: 100%;
4573
- }
4574
- .e-listbox-wrapper .e-list-icon + .e-list-text, .e-listbox-wrapper .e-icon-wrapper .e-list-text, .e-listbox-wrapper .e-icon-wrapper.e-text-content.e-checkbox .e-list-text,
4575
- .e-listbox-container .e-list-icon + .e-list-text,
4576
- .e-listbox-container .e-icon-wrapper .e-list-text,
4577
- .e-listbox-container .e-icon-wrapper.e-text-content.e-checkbox .e-list-text,
4578
- .e-listboxtool-wrapper .e-list-icon + .e-list-text,
4579
- .e-listboxtool-wrapper .e-icon-wrapper .e-list-text,
4580
- .e-listboxtool-wrapper .e-icon-wrapper.e-text-content.e-checkbox .e-list-text {
4581
- width: calc(100% - 60px);
4582
- }
4583
- .e-listbox-wrapper .e-list-icon,
4584
- .e-listbox-container .e-list-icon,
4585
- .e-listboxtool-wrapper .e-list-icon {
4586
- height: 30px;
4587
- margin-right: 16px;
4588
- width: 30px;
4589
- }
4590
- .e-listbox-wrapper .e-content,
4591
- .e-listbox-container .e-content,
4592
- .e-listboxtool-wrapper .e-content {
4593
- overflow: hidden;
4594
- position: relative;
4595
- }
4596
- .e-listbox-wrapper .e-list-header .e-text,
4597
- .e-listbox-container .e-list-header .e-text,
4598
- .e-listboxtool-wrapper .e-list-header .e-text {
4599
- cursor: pointer;
4600
- text-indent: 0;
4601
- }
4602
- .e-listbox-wrapper .e-text .e-headertext,
4603
- .e-listbox-container .e-text .e-headertext,
4604
- .e-listboxtool-wrapper .e-text .e-headertext {
4605
- display: inline-block;
4606
- line-height: 18px;
4607
- }
4608
- .e-listbox-wrapper.e-rtl,
4609
- .e-listbox-container.e-rtl,
4610
- .e-listboxtool-wrapper.e-rtl {
4611
- direction: rtl;
4612
- }
4613
- .e-listbox-wrapper.e-rtl .e-list-icon,
4614
- .e-listbox-container.e-rtl .e-list-icon,
4615
- .e-listboxtool-wrapper.e-rtl .e-list-icon {
4616
- margin-left: 16px;
4617
- margin-right: 0;
4618
- }
4619
- .e-listbox-wrapper.e-rtl .e-icon-collapsible,
4620
- .e-listbox-container.e-rtl .e-icon-collapsible,
4621
- .e-listboxtool-wrapper.e-rtl .e-icon-collapsible {
4622
- left: 0;
4623
- right: initial;
4624
- top: 50%;
4625
- -webkit-transform: translateY(-50%) rotate(180deg);
4626
- transform: translateY(-50%) rotate(180deg);
4627
- }
4628
- .e-listbox-wrapper.e-rtl .e-list-header .e-text,
4629
- .e-listbox-container.e-rtl .e-list-header .e-text,
4630
- .e-listboxtool-wrapper.e-rtl .e-list-header .e-text {
4631
- cursor: pointer;
4632
- }
4633
- .e-listbox-wrapper.e-rtl .e-but-back,
4634
- .e-listbox-container.e-rtl .e-but-back,
4635
- .e-listboxtool-wrapper.e-rtl .e-but-back {
4636
- -webkit-transform: rotate(180deg);
4637
- transform: rotate(180deg);
4638
- }
4639
- .e-listbox-wrapper.e-rtl .e-icon-back,
4640
- .e-listbox-container.e-rtl .e-icon-back,
4641
- .e-listboxtool-wrapper.e-rtl .e-icon-back {
4642
- margin-top: -2px;
4643
- }
4644
- .e-listbox-wrapper.e-rtl .e-checkbox .e-checkbox-left,
4645
- .e-listbox-wrapper.e-rtl .e-checkbox-wrapper,
4646
- .e-listbox-container.e-rtl .e-checkbox .e-checkbox-left,
4647
- .e-listbox-container.e-rtl .e-checkbox-wrapper,
4648
- .e-listboxtool-wrapper.e-rtl .e-checkbox .e-checkbox-left,
4649
- .e-listboxtool-wrapper.e-rtl .e-checkbox-wrapper {
4650
- margin: 0;
4651
- padding: 2px 0 2px 12px;
4652
- vertical-align: top;
4653
- }
4654
- .e-listbox-wrapper.e-rtl .e-checkbox .e-checkbox-right,
4655
- .e-listbox-container.e-rtl .e-checkbox .e-checkbox-right,
4656
- .e-listboxtool-wrapper.e-rtl .e-checkbox .e-checkbox-right {
4657
- margin: -2px 8px 0 0;
4658
- }
4659
- .e-listbox-wrapper .e-checkbox-wrapper,
4660
- .e-listbox-container .e-checkbox-wrapper,
4661
- .e-listboxtool-wrapper .e-checkbox-wrapper {
4662
- margin: 0;
4663
- text-indent: 0;
4664
- vertical-align: middle;
4665
- padding: 2px 12px 2px 0;
4666
- vertical-align: top;
4667
- }
4668
- .e-listbox-wrapper .e-checkbox-wrapper .e-frame,
4669
- .e-listbox-container .e-checkbox-wrapper .e-frame,
4670
- .e-listboxtool-wrapper .e-checkbox-wrapper .e-frame {
4671
- margin: 0 !important; /* stylelint-disable-line declaration-no-important */
4672
- }
4673
- .e-listbox-wrapper.e-checkbox-right .e-checkbox-wrapper,
4674
- .e-listbox-container.e-checkbox-right .e-checkbox-wrapper,
4675
- .e-listboxtool-wrapper.e-checkbox-right .e-checkbox-wrapper {
4676
- position: absolute;
4677
- right: 0;
4678
- top: 30%;
4679
- }
4680
- .e-listbox-wrapper .e-input-group,
4681
- .e-listbox-container .e-input-group,
4682
- .e-listboxtool-wrapper .e-input-group {
4683
- padding: 4px 8px;
4684
- }
4685
- .e-listbox-wrapper .e-input-focus,
4686
- .e-listbox-container .e-input-focus,
4687
- .e-listboxtool-wrapper .e-input-focus {
4688
- padding: 4px 4px 4px 8px;
4689
- }
4690
- .e-listbox-wrapper .e-hidden-select,
4691
- .e-listbox-container .e-hidden-select,
4692
- .e-listboxtool-wrapper .e-hidden-select {
4693
- height: 1px;
4694
- opacity: 0;
4695
- position: absolute;
4696
- width: 100%;
4697
- }
4698
- .e-listbox-wrapper .e-placeholder,
4699
- .e-listbox-container .e-placeholder,
4700
- .e-listboxtool-wrapper .e-placeholder {
4701
- background-color: var(--color-sf-primary-border-color);
4702
- display: block;
4703
- border: 2px solid var(--color-sf-primary-border-color);
4704
- height: 1px;
4705
- }
4706
-
4707
- ejs-listbox {
4686
+ color: var(--color-sf-content-text-color-alt2);
4708
4687
  display: block;
4688
+ font-size: 14px;
4689
+ margin: 0;
4690
+ padding: 2px 0 0 0;
4691
+ word-wrap: break-word;
4709
4692
  }
4710
-
4711
- .e-listbox-wrapper:not(.e-listbox-container),
4712
- .e-listbox-wrapper.e-filter-list .e-list-parent {
4713
- overflow: auto;
4693
+ .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content:not(.e-text-overflow),
4694
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content:not(.e-text-overflow),
4695
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content:not(.e-text-overflow) {
4696
+ overflow: hidden;
4697
+ text-overflow: ellipsis;
4698
+ white-space: nowrap;
4714
4699
  }
4715
-
4716
- .e-listbox-wrapper.e-sortableclone,
4717
- .e-listbox-container.e-sortableclone,
4718
- .e-listboxtool-wrapper.e-sortableclone {
4719
- border-width: 0;
4720
- overflow: visible;
4700
+ .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
4701
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
4702
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-avatar .e-avatar {
4703
+ height: 40px;
4704
+ left: 0;
4705
+ position: absolute;
4706
+ width: 40px;
4707
+ left: 0;
4721
4708
  }
4722
- .e-listbox-wrapper.e-sortableclone .e-list-item,
4723
- .e-listbox-container.e-sortableclone .e-list-item,
4724
- .e-listboxtool-wrapper.e-sortableclone .e-list-item {
4725
- list-style-type: none;
4709
+ .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge),
4710
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge),
4711
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge) {
4712
+ padding-left: 68px;
4713
+ padding-right: 16px;
4726
4714
  }
4727
- .e-listbox-wrapper.e-sortableclone .e-ripple,
4728
- .e-listbox-container.e-sortableclone .e-ripple,
4729
- .e-listboxtool-wrapper.e-sortableclone .e-ripple {
4730
- overflow: visible;
4715
+ .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge),
4716
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge),
4717
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) {
4718
+ padding-left: 16px;
4719
+ padding-right: 68px;
4731
4720
  }
4732
- .e-listbox-wrapper.e-sortableclone .e-ripple .e-ripple-element,
4733
- .e-listbox-container.e-sortableclone .e-ripple .e-ripple-element,
4734
- .e-listboxtool-wrapper.e-sortableclone .e-ripple .e-ripple-element {
4735
- display: none;
4721
+ .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar,
4722
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar,
4723
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar {
4724
+ height: 40px;
4725
+ left: 0;
4726
+ position: absolute;
4727
+ width: 40px;
4728
+ right: 0;
4736
4729
  }
4737
- .e-listbox-wrapper.e-sortableclone .e-list-badge,
4738
- .e-listbox-container.e-sortableclone .e-list-badge,
4739
- .e-listboxtool-wrapper.e-sortableclone .e-list-badge {
4740
- -webkit-box-align: center;
4741
- -ms-flex-align: center;
4742
- align-items: center;
4743
- background-color: var(--color-sf-primary-border-color);
4744
- border: 1px solid var(--color-sf-primary-text-color);
4745
- border-radius: 999px;
4746
- color: var(--color-sf-primary-text-color);
4747
- display: -webkit-box;
4748
- display: -ms-flexbox;
4749
- display: flex;
4750
- font-size: 12px;
4751
- height: 22px;
4752
- -webkit-box-pack: center;
4753
- -ms-flex-pack: center;
4754
- justify-content: center;
4730
+ .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar .e-avatar, .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar-right:not(.e-list-badge) .e-avatar,
4731
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar .e-avatar,
4732
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar-right:not(.e-list-badge) .e-avatar,
4733
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar .e-avatar,
4734
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar-right:not(.e-list-badge) .e-avatar {
4735
+ top: 0;
4736
+ }
4737
+ .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-badge .e-badge,
4738
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge .e-badge,
4739
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-badge .e-badge {
4740
+ font-size: 10px;
4741
+ height: 18px;
4742
+ line-height: 16px;
4743
+ padding: 0;
4755
4744
  position: absolute;
4756
- right: -10px;
4757
- top: -10px;
4758
- width: 22px;
4745
+ right: 12px;
4746
+ top: 50%;
4747
+ -webkit-transform: translateY(-50%);
4748
+ transform: translateY(-50%);
4749
+ width: 32px;
4759
4750
  }
4760
-
4761
- .e-listboxtool-wrapper.e-sortableclone {
4751
+ .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar,
4752
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar,
4753
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar {
4754
+ padding-left: 68px;
4755
+ padding-right: 10px;
4756
+ }
4757
+ .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar),
4758
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar),
4759
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar) {
4760
+ padding-left: 16px;
4761
+ padding-right: 10px;
4762
+ }
4763
+ .e-listbox-wrapper.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content,
4764
+ .e-listbox-container.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content,
4765
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content {
4762
4766
  display: block;
4767
+ margin: 0;
4768
+ overflow: hidden;
4769
+ padding: 8px 0;
4770
+ text-overflow: ellipsis;
4771
+ white-space: nowrap;
4763
4772
  }
4764
-
4765
- .e-listboxtool-wrapper,
4766
- .e-listboxtool-container {
4767
- cursor: pointer;
4768
- display: -webkit-box;
4769
- display: -ms-flexbox;
4770
- display: flex;
4773
+ .e-listbox-wrapper.e-list-template .e-list-item.e-list-item:hover .e-list-item-header, .e-listbox-wrapper.e-list-template .e-list-item.e-list-item:hover .e-list-content,
4774
+ .e-listbox-container.e-list-template .e-list-item.e-list-item:hover .e-list-item-header,
4775
+ .e-listbox-container.e-list-template .e-list-item.e-list-item:hover .e-list-content,
4776
+ .e-listboxtool-wrapper.e-list-template .e-list-item.e-list-item:hover .e-list-item-header,
4777
+ .e-listboxtool-wrapper.e-list-template .e-list-item.e-list-item:hover .e-list-content {
4778
+ color: var(--color-sf-content-text-color-hover);
4771
4779
  }
4772
- .e-listboxtool-wrapper *,
4773
- .e-listboxtool-container * {
4774
- -webkit-box-sizing: border-box;
4775
- box-sizing: border-box;
4780
+ .e-listbox-wrapper.e-list-template .e-list-item.e-selected .e-list-item-header, .e-listbox-wrapper.e-list-template .e-list-item.e-selected .e-list-content,
4781
+ .e-listbox-container.e-list-template .e-list-item.e-selected .e-list-item-header,
4782
+ .e-listbox-container.e-list-template .e-list-item.e-selected .e-list-content,
4783
+ .e-listboxtool-wrapper.e-list-template .e-list-item.e-selected .e-list-item-header,
4784
+ .e-listboxtool-wrapper.e-list-template .e-list-item.e-selected .e-list-content {
4785
+ color: var(--color-sf-content-text-color-selected);
4776
4786
  }
4777
- .e-listboxtool-wrapper.e-disabled,
4778
- .e-listboxtool-container.e-disabled {
4779
- cursor: default;
4780
- pointer-events: none;
4787
+ .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
4788
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
4789
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar {
4790
+ left: inherit;
4791
+ right: 0;
4781
4792
  }
4782
- .e-listboxtool-wrapper .e-listbox-wrapper,
4783
- .e-listboxtool-wrapper .e-list-wrap,
4784
- .e-listboxtool-container .e-listbox-wrapper,
4785
- .e-listboxtool-container .e-list-wrap {
4786
- -webkit-box-flex: 1;
4787
- -ms-flex: 1;
4788
- flex: 1;
4793
+ .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge),
4794
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge),
4795
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge) {
4796
+ padding-left: 16px;
4797
+ padding-right: 68px;
4789
4798
  }
4790
- .e-listboxtool-wrapper.e-right .e-listbox-tool,
4791
- .e-listboxtool-container.e-right .e-listbox-tool {
4792
- margin-left: 15px;
4799
+ .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge),
4800
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge),
4801
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) {
4802
+ padding-left: 68px;
4803
+ padding-right: 16px;
4793
4804
  }
4794
- .e-listboxtool-wrapper.e-left .e-listbox-tool,
4795
- .e-listboxtool-container.e-left .e-listbox-tool {
4796
- margin-right: 15px;
4805
+ .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar,
4806
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar,
4807
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar {
4808
+ left: 0;
4809
+ right: inherit;
4797
4810
  }
4798
- .e-listboxtool-wrapper .e-listbox-tool,
4799
- .e-listboxtool-container .e-listbox-tool {
4800
- border: 1px solid var(--color-sf-border-light);
4801
- overflow: auto;
4802
- padding: 8px;
4811
+ .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge .e-badge,
4812
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge .e-badge,
4813
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge .e-badge {
4814
+ left: 12px;
4815
+ right: inherit;
4803
4816
  }
4804
- .e-listboxtool-wrapper .e-listbox-tool .e-btn,
4805
- .e-listboxtool-container .e-listbox-tool .e-btn {
4806
- display: list-item;
4807
- list-style-type: none;
4808
- margin-bottom: 10px;
4817
+ .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar,
4818
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar,
4819
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar {
4820
+ padding-left: 10px;
4821
+ padding-right: 68px;
4809
4822
  }
4810
- .e-listboxtool-wrapper.e-checkbox-right .e-checkbox-wrapper,
4811
- .e-listboxtool-container.e-checkbox-right .e-checkbox-wrapper {
4812
- position: absolute;
4813
- right: 0;
4814
- top: 30%;
4823
+ .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar),
4824
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar),
4825
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar) {
4826
+ padding-left: 10px;
4827
+ padding-right: 16px;
4815
4828
  }
4816
4829
 
4817
- .e-rtl.e-listboxtool-wrapper.e-right .e-listbox-tool,
4818
- .e-rtl.e-listboxtool-container.e-right .e-listbox-tool {
4819
- margin-right: 15px;
4830
+ .e-listbox-wrapper.e-sortableclone .e-list-item,
4831
+ .e-listbox-container.e-sortableclone .e-list-item {
4832
+ background-color: var(--color-sf-content-bg-color-alt3) !important; /* stylelint-disable-line declaration-no-important */
4833
+ color: var(--color-sf-content-text-color) !important; /* stylelint-disable-line declaration-no-important */
4820
4834
  }
4821
- .e-rtl.e-listboxtool-wrapper.e-left .e-listbox-tool,
4822
- .e-rtl.e-listboxtool-container.e-left .e-listbox-tool {
4823
- margin-left: 15px;
4835
+
4836
+ .e-listbox-container.e-filter-list .e-list-parent, .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent, .e-listbox-container .e-selectall-parent + .e-list-parent {
4837
+ height: 100%;
4824
4838
  }
4825
4839
 
4826
- .e-listbox-wrapper:not(.e-list-template) .e-list-item,
4827
- .e-listbox-wrapper .e-list-nrt,
4828
- .e-listbox-wrapper .e-selectall-parent,
4829
- .e-listbox-container:not(.e-list-template) .e-list-item,
4830
- .e-listbox-container .e-list-nrt,
4831
- .e-listbox-container .e-selectall-parent,
4832
- .e-listboxtool-wrapper .e-listbox-wrapper:not(.e-list-template) .e-list-item,
4833
- .e-listboxtool-wrapper .e-listbox-wrapper .e-list-nrt,
4834
- .e-listboxtool-wrapper .e-listbox-wrapper .e-selectall-parent {
4835
- height: 32px;
4836
- line-height: 20px;
4837
- padding: 6px 12px;
4838
- position: relative;
4839
- font-size: 14px;
4840
- border-radius: calc(var(--e-radius) * 0.25) !important; /* stylelint-disable-line declaration-no-important */
4840
+ .e-listbox-container.e-filter-list .e-list-wrap {
4841
+ height: calc(100% - 50px) !important; /* stylelint-disable-line declaration-no-important */
4841
4842
  }
4842
- .e-listbox-wrapper .e-list-icon,
4843
- .e-listbox-container .e-list-icon,
4844
- .e-listboxtool-wrapper .e-listbox-wrapper .e-list-icon {
4845
- display: inline;
4846
- vertical-align: middle;
4847
- width: auto;
4848
- height: auto;
4849
- padding-bottom: 1px;
4843
+
4844
+ .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-wrap {
4845
+ height: calc(100% - 38px) !important; /* stylelint-disable-line declaration-no-important */
4846
+ }
4847
+
4848
+ .e-listbox-container .e-selectall-parent + .e-list-wrap {
4849
+ height: calc(100% - 38px) !important; /* stylelint-disable-line declaration-no-important */
4850
4850
  }
4851
4851
 
4852
4852
  /* stylelint-disable-line no-empty-source */