@syncfusion/ej2-ribbon 25.2.5 → 26.1.35

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 (112) hide show
  1. package/.eslintrc.json +3 -2
  2. package/dist/ej2-ribbon.umd.min.js +2 -2
  3. package/dist/ej2-ribbon.umd.min.js.map +1 -1
  4. package/dist/es6/ej2-ribbon.es2015.js +821 -592
  5. package/dist/es6/ej2-ribbon.es2015.js.map +1 -1
  6. package/dist/es6/ej2-ribbon.es5.js +812 -577
  7. package/dist/es6/ej2-ribbon.es5.js.map +1 -1
  8. package/dist/global/ej2-ribbon.min.js +2 -2
  9. package/dist/global/ej2-ribbon.min.js.map +1 -1
  10. package/dist/global/index.d.ts +1 -1
  11. package/package.json +13 -13
  12. package/src/ribbon/base/interface.d.ts +14 -0
  13. package/src/ribbon/base/ribbon-model.d.ts +1 -1
  14. package/src/ribbon/base/ribbon.d.ts +3 -1
  15. package/src/ribbon/base/ribbon.js +195 -94
  16. package/src/ribbon/items/ribbon-button.js +6 -1
  17. package/src/ribbon/items/ribbon-gallery.d.ts +15 -6
  18. package/src/ribbon/items/ribbon-gallery.js +164 -96
  19. package/src/ribbon/items/ribbon-groupbutton.d.ts +1 -0
  20. package/src/ribbon/items/ribbon-groupbutton.js +11 -3
  21. package/src/ribbon/models/ribbon-contextual-tab-settings-model.d.ts +1 -1
  22. package/src/ribbon/models/ribbon-gallery-group-model.d.ts +5 -5
  23. package/src/ribbon/models/ribbon-gallery-group.d.ts +2 -2
  24. package/src/ribbon/models/ribbon-gallery-group.js +2 -2
  25. package/src/ribbon/models/ribbon-gallery-item-model.d.ts +5 -5
  26. package/src/ribbon/models/ribbon-gallery-item.d.ts +1 -1
  27. package/src/ribbon/models/ribbon-gallery-item.js +1 -1
  28. package/src/ribbon/models/ribbon-gallery-settings-model.d.ts +1 -1
  29. package/src/ribbon/models/ribbon-gallery-settings.d.ts +3 -3
  30. package/src/ribbon/models/ribbon-gallery-settings.js +2 -2
  31. package/src/ribbon/modules/ribbon-backstage.d.ts +6 -3
  32. package/src/ribbon/modules/ribbon-backstage.js +65 -12
  33. package/src/ribbon/modules/ribbon-contextualtab.js +5 -2
  34. package/src/ribbon/modules/ribbon-keytip.d.ts +1 -0
  35. package/src/ribbon/modules/ribbon-keytip.js +58 -46
  36. package/styles/bootstrap-dark.css +452 -269
  37. package/styles/bootstrap-dark.scss +18 -1
  38. package/styles/bootstrap.css +456 -276
  39. package/styles/bootstrap.scss +18 -1
  40. package/styles/bootstrap4.css +455 -272
  41. package/styles/bootstrap4.scss +18 -1
  42. package/styles/bootstrap5-dark.css +470 -278
  43. package/styles/bootstrap5-dark.scss +18 -1
  44. package/styles/bootstrap5.css +470 -278
  45. package/styles/bootstrap5.scss +18 -1
  46. package/styles/fabric-dark.css +451 -269
  47. package/styles/fabric-dark.scss +18 -1
  48. package/styles/fabric.css +450 -272
  49. package/styles/fabric.scss +18 -1
  50. package/styles/fluent-dark.css +472 -277
  51. package/styles/fluent-dark.scss +18 -1
  52. package/styles/fluent.css +472 -277
  53. package/styles/fluent.scss +18 -1
  54. package/styles/fluent2.css +3868 -0
  55. package/styles/fluent2.scss +18 -0
  56. package/styles/highcontrast-light.css +445 -263
  57. package/styles/highcontrast-light.scss +17 -1
  58. package/styles/highcontrast.css +451 -273
  59. package/styles/highcontrast.scss +18 -1
  60. package/styles/material-dark.css +540 -283
  61. package/styles/material-dark.scss +18 -1
  62. package/styles/material.css +539 -289
  63. package/styles/material.scss +18 -1
  64. package/styles/material3-dark.css +496 -280
  65. package/styles/material3-dark.scss +18 -1
  66. package/styles/material3.css +496 -280
  67. package/styles/material3.scss +18 -1
  68. package/styles/ribbon/_bds-definition.scss +56 -20
  69. package/styles/ribbon/_bootstrap-dark-definition.scss +56 -20
  70. package/styles/ribbon/_bootstrap-definition.scss +57 -21
  71. package/styles/ribbon/_bootstrap4-definition.scss +57 -21
  72. package/styles/ribbon/_bootstrap5-definition.scss +57 -21
  73. package/styles/ribbon/_bootstrap5.3-definition.scss +396 -0
  74. package/styles/ribbon/_fabric-dark-definition.scss +55 -19
  75. package/styles/ribbon/_fabric-definition.scss +56 -20
  76. package/styles/ribbon/_fluent-definition.scss +59 -23
  77. package/styles/ribbon/_fluent2-definition.scss +396 -0
  78. package/styles/ribbon/_fusionnew-definition.scss +50 -14
  79. package/styles/ribbon/_highcontrast-definition.scss +58 -22
  80. package/styles/ribbon/_highcontrast-light-definition.scss +49 -13
  81. package/styles/ribbon/_layout.scss +359 -399
  82. package/styles/ribbon/_material-dark-definition.scss +56 -20
  83. package/styles/ribbon/_material-definition.scss +56 -20
  84. package/styles/ribbon/_material3-definition.scss +56 -19
  85. package/styles/ribbon/_tailwind-definition.scss +56 -20
  86. package/styles/ribbon/_theme.scss +118 -170
  87. package/styles/ribbon/bootstrap-dark.css +452 -269
  88. package/styles/ribbon/bootstrap.css +456 -276
  89. package/styles/ribbon/bootstrap4.css +455 -272
  90. package/styles/ribbon/bootstrap5-dark.css +470 -278
  91. package/styles/ribbon/bootstrap5.css +470 -278
  92. package/styles/ribbon/fabric-dark.css +451 -269
  93. package/styles/ribbon/fabric.css +450 -272
  94. package/styles/ribbon/fluent-dark.css +472 -277
  95. package/styles/ribbon/fluent.css +472 -277
  96. package/styles/ribbon/fluent2.css +3868 -0
  97. package/styles/ribbon/fluent2.scss +18 -0
  98. package/styles/ribbon/highcontrast-light.css +445 -263
  99. package/styles/ribbon/highcontrast.css +451 -273
  100. package/styles/ribbon/icons/_bootstrap5.3.scss +9 -0
  101. package/styles/ribbon/icons/_fluent2.scss +9 -0
  102. package/styles/ribbon/material-dark.css +540 -283
  103. package/styles/ribbon/material.css +539 -289
  104. package/styles/ribbon/material3-dark.css +496 -280
  105. package/styles/ribbon/material3.css +496 -280
  106. package/styles/ribbon/tailwind-dark.css +506 -280
  107. package/styles/ribbon/tailwind.css +506 -280
  108. package/styles/tailwind-dark.css +506 -280
  109. package/styles/tailwind-dark.scss +18 -1
  110. package/styles/tailwind.css +506 -280
  111. package/styles/tailwind.scss +18 -1
  112. package/CHANGELOG.md +0 -101
@@ -35,7 +35,8 @@
35
35
 
36
36
  .e-ddl.e-popup {
37
37
  border: 0;
38
- box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.4);
38
+ -webkit-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.4);
39
+ box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.4);
39
40
  margin-top: 1px;
40
41
  }
41
42
  .e-ddl.e-popup .e-content.e-nodata {
@@ -45,6 +46,7 @@
45
46
  color: #23726c;
46
47
  }
47
48
  .e-ddl.e-popup .e-input-group {
49
+ display: -webkit-box;
48
50
  display: -ms-flexbox;
49
51
  display: flex;
50
52
  width: auto;
@@ -105,6 +107,7 @@
105
107
 
106
108
  .e-ribbon.e-rbn {
107
109
  display: block;
110
+ border-radius: unset;
108
111
  }
109
112
  .e-ribbon.e-rbn .e-ribbon-tab .e-toolbar {
110
113
  min-height: auto;
@@ -115,14 +118,15 @@
115
118
  }
116
119
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu,
117
120
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-backstage {
118
- position: absolute;
121
+ font-size: 14px;
122
+ font-weight: 400;
119
123
  line-height: 22px;
124
+ position: absolute;
120
125
  padding: 8px 15px 10px;
121
126
  border: 1px solid;
122
127
  border-width: 0 0 1px 0;
123
- font-size: 14px;
124
- font-weight: 400;
125
- box-shadow: none;
128
+ -webkit-box-shadow: none;
129
+ box-shadow: none;
126
130
  text-transform: none;
127
131
  }
128
132
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu.e-active,
@@ -132,16 +136,19 @@
132
136
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu.e-active, .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu:focus,
133
137
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-backstage.e-active,
134
138
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-backstage:focus {
135
- box-shadow: none;
139
+ -webkit-box-shadow: none;
140
+ box-shadow: none;
136
141
  outline: none;
137
142
  }
138
143
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-help-template {
139
144
  position: absolute;
140
145
  top: 0;
146
+ display: -webkit-box;
141
147
  display: -ms-flexbox;
142
148
  display: flex;
143
- -ms-flex-align: center;
144
- align-items: center;
149
+ -webkit-box-align: center;
150
+ -ms-flex-align: center;
151
+ align-items: center;
145
152
  height: 40px;
146
153
  padding-right: 12px;
147
154
  border-bottom: 1px solid;
@@ -161,8 +168,8 @@
161
168
  z-index: 1;
162
169
  }
163
170
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-items {
164
- min-height: auto;
165
171
  height: 40px;
172
+ min-height: auto;
166
173
  }
167
174
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-items:not(.e-tbar-pos) .e-toolbar-item:first-child,
168
175
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-items:not(.e-tbar-pos) .e-toolbar-item:last-child {
@@ -172,6 +179,11 @@
172
179
  vertical-align: unset;
173
180
  margin: 0;
174
181
  border: none;
182
+ border-radius: unset;
183
+ }
184
+ .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item:not(.e-separator) {
185
+ height: auto;
186
+ min-height: auto;
175
187
  }
176
188
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item.e-active {
177
189
  border: none;
@@ -185,12 +197,12 @@
185
197
  border: none;
186
198
  }
187
199
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item .e-tab-text {
188
- padding: 8px 15px 10px;
200
+ font-size: 14px;
201
+ font-weight: 400;
189
202
  line-height: 22px;
203
+ padding: 8px 15px 10px;
190
204
  text-transform: none;
191
205
  margin: 0;
192
- font-size: 14px;
193
- font-weight: 400;
194
206
  }
195
207
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item .e-text-wrap {
196
208
  height: auto;
@@ -198,12 +210,12 @@
198
210
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item.e-active .e-text-wrap::before {
199
211
  display: none;
200
212
  }
201
- .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item:not(.e-separator) {
202
- height: auto;
203
- min-height: auto;
213
+ .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item.e-active .e-text-wrap .e-tab-text {
214
+ font-weight: 400;
204
215
  }
205
216
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll.e-scroll-device .e-scroll-nav.e-scroll-right-nav {
206
- box-shadow: none;
217
+ -webkit-box-shadow: none;
218
+ box-shadow: none;
207
219
  }
208
220
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll {
209
221
  padding: 0;
@@ -214,7 +226,8 @@
214
226
  min-width: auto;
215
227
  width: auto;
216
228
  border-style: solid;
217
- transform: none;
229
+ -webkit-transform: none;
230
+ transform: none;
218
231
  border-width: 1px;
219
232
  border-radius: unset;
220
233
  z-index: 3;
@@ -224,13 +237,14 @@
224
237
  }
225
238
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll .e-scroll-nav .e-nav-arrow {
226
239
  font-size: 16px;
227
- height: auto;
228
- transform: none;
240
+ font-weight: 400;
229
241
  line-height: 16px;
242
+ height: auto;
243
+ -webkit-transform: none;
244
+ transform: none;
230
245
  padding: 0 4px;
231
246
  width: auto;
232
247
  letter-spacing: unset;
233
- font-weight: 400;
234
248
  }
235
249
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll .e-scroll-nav .e-nav-arrow::before {
236
250
  font-size: 16px;
@@ -257,7 +271,8 @@
257
271
  border: 2px solid;
258
272
  }
259
273
  .e-ribbon.e-rbn .e-ribbon-collapse-btn:not(.e-ribbon-expand-btn) {
260
- transform: rotate(180deg);
274
+ -webkit-transform: rotate(180deg);
275
+ transform: rotate(180deg);
261
276
  }
262
277
  .e-ribbon.e-rbn.e-ribbon-overflow .e-content {
263
278
  width: calc(100% - 20px - 40px);
@@ -270,7 +285,8 @@
270
285
  border: 2px solid;
271
286
  height: 40px;
272
287
  margin: auto;
273
- box-shadow: none;
288
+ -webkit-box-shadow: none;
289
+ box-shadow: none;
274
290
  }
275
291
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn .e-btn-icon,
276
292
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn .e-btn-icon {
@@ -292,23 +308,27 @@
292
308
  bottom: 0;
293
309
  position: absolute;
294
310
  }
311
+ .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn.e-ribbon-hide {
312
+ display: none;
313
+ }
295
314
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-container {
315
+ display: -webkit-inline-box;
296
316
  display: -ms-inline-flexbox;
297
317
  display: inline-flex;
298
318
  }
299
- .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn.e-ribbon-hide {
300
- display: none;
301
- }
302
319
  .e-ribbon.e-rbn.e-ribbon-minimize .e-ribbon-tab .e-content, .e-ribbon.e-rbn.e-ribbon-minimize .e-ribbon-collapse-btn, .e-ribbon.e-rbn.e-ribbon-minimize .e-ribbon-overall-of-btn {
303
320
  display: none;
304
321
  }
305
- .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-item .e-ribbon-gallery-wrapper {
322
+ .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-item:has(.e-ribbon-gallery-container:not(.e-hidden)) {
306
323
  height: 30px;
307
324
  }
325
+ .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-item .e-ribbon-gallery-wrapper {
326
+ margin: 0;
327
+ }
308
328
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-item .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item {
309
- padding: 5px 0;
310
329
  width: 78px;
311
- margin: 2px;
330
+ margin: 0;
331
+ border-radius: 0;
312
332
  max-height: 26px;
313
333
  }
314
334
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-item .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item.e-disabled {
@@ -342,10 +362,12 @@
342
362
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content {
343
363
  padding: 0;
344
364
  height: 40px;
345
- -ms-flex-align: center;
346
- align-items: center;
365
+ -webkit-box-align: center;
366
+ -ms-flex-align: center;
367
+ align-items: center;
347
368
  }
348
369
  .e-ribbon.e-rbn .e-ribbon-tab-item {
370
+ display: -webkit-inline-box;
349
371
  display: -ms-inline-flexbox;
350
372
  display: inline-flex;
351
373
  }
@@ -403,29 +425,37 @@
403
425
  }
404
426
 
405
427
  .e-ribbon-backstage-popup.e-ribbon-backstage-open {
428
+ display: -webkit-box;
406
429
  display: -ms-flexbox;
407
430
  display: flex;
408
431
  }
409
-
410
432
  .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper {
433
+ display: -webkit-box;
411
434
  display: -ms-flexbox;
412
435
  display: flex;
413
- -ms-flex-direction: column;
414
- flex-direction: column;
436
+ -webkit-box-orient: vertical;
437
+ -webkit-box-direction: normal;
438
+ -ms-flex-direction: column;
439
+ flex-direction: column;
415
440
  }
416
441
  .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper .e-ribbon-backstage-items-wrapper {
442
+ display: -webkit-box;
417
443
  display: -ms-flexbox;
418
444
  display: flex;
419
- -ms-flex-direction: column;
420
- flex-direction: column;
421
- -ms-flex-pack: justify;
422
- justify-content: space-between;
445
+ -webkit-box-orient: vertical;
446
+ -webkit-box-direction: normal;
447
+ -ms-flex-direction: column;
448
+ flex-direction: column;
449
+ -webkit-box-pack: justify;
450
+ -ms-flex-pack: justify;
451
+ justify-content: space-between;
423
452
  height: 100%;
424
453
  }
425
454
  .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper .e-btn {
426
455
  border: none;
427
456
  border-radius: unset;
428
- box-shadow: none;
457
+ -webkit-box-shadow: none;
458
+ box-shadow: none;
429
459
  padding: unset;
430
460
  text-align: start;
431
461
  width: 100%;
@@ -433,10 +463,10 @@
433
463
  line-height: 40px;
434
464
  }
435
465
  .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper .e-btn .e-btn-icon {
436
- width: auto;
437
- margin: 0;
438
466
  font-size: 16px;
439
467
  line-height: 16px;
468
+ width: auto;
469
+ margin: 0;
440
470
  padding: 12px 16px;
441
471
  }
442
472
  .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper .e-btn:focus {
@@ -479,10 +509,10 @@
479
509
  border-width: 2px;
480
510
  }
481
511
  .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper .e-ribbon-backstage-menu.e-menu-wrapper ul.e-vertical .e-menu-item:not(.e-separator) .e-menu-icon, .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper .e-ribbon-backstage-menu.e-menu-wrapper ul.e-ul .e-menu-item:not(.e-separator) .e-menu-icon {
482
- width: auto;
483
- margin-right: unset;
484
512
  font-size: 16px;
485
513
  line-height: 16px;
514
+ width: auto;
515
+ margin-right: unset;
486
516
  padding: 12px 16px;
487
517
  }
488
518
  .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper .e-ribbon-backstage-menu.e-menu-wrapper ul.e-vertical .e-menu-item:not(.e-separator).e-blankicon, .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper .e-ribbon-backstage-menu.e-menu-wrapper ul.e-ul .e-menu-item:not(.e-separator).e-blankicon {
@@ -501,32 +531,36 @@
501
531
  .e-ribbon-group-overflow-ddb {
502
532
  border: 1px solid;
503
533
  }
534
+ .e-ribbon.e-rbn .e-disabled,
535
+ .e-ribbon-group-overflow-ddb .e-disabled {
536
+ opacity: 0.35;
537
+ }
504
538
  .e-ribbon.e-rbn .e-input-group,
505
539
  .e-ribbon-group-overflow-ddb .e-input-group {
506
540
  height: 36px;
507
541
  border-radius: unset;
508
- margin-bottom: 4px;
542
+ margin: 0 0 4px;
509
543
  }
510
544
  .e-ribbon.e-rbn .e-input-group input.e-input,
511
545
  .e-ribbon-group-overflow-ddb .e-input-group input.e-input {
512
- padding: 7px 0 7px 12px;
513
546
  font-size: 14px;
514
- line-height: 22px;
515
547
  font-weight: 400;
548
+ line-height: 22px;
516
549
  height: auto;
517
550
  min-height: auto;
551
+ padding: 7px 0 7px 12px;
518
552
  }
519
553
  .e-ribbon.e-rbn .e-input-group.e-control-wrapper .e-input-group-icon,
520
554
  .e-ribbon-group-overflow-ddb .e-input-group.e-control-wrapper .e-input-group-icon {
521
555
  font-size: 12px;
556
+ font-weight: 400;
522
557
  line-height: 12px;
523
558
  height: auto;
559
+ min-height: auto;
524
560
  padding: 12px 4px 12px 2px;
525
561
  margin: 0;
526
- font-weight: 400;
527
562
  border: none;
528
563
  min-width: auto;
529
- min-height: auto;
530
564
  border-radius: unset;
531
565
  }
532
566
  .e-ribbon.e-rbn .e-input-group.e-control-wrapper .e-input-group-icon.e-ddl-icon,
@@ -553,16 +587,19 @@
553
587
  }
554
588
  .e-ribbon.e-rbn .e-ribbon-group-header,
555
589
  .e-ribbon-group-overflow-ddb .e-ribbon-group-header {
556
- -ms-flex-align: center;
557
- align-items: center;
590
+ font-size: 12px;
591
+ line-height: 18px;
592
+ -webkit-box-align: center;
593
+ -ms-flex-align: center;
594
+ align-items: center;
595
+ display: -webkit-box;
558
596
  display: -ms-flexbox;
559
597
  display: flex;
560
- -ms-flex-pack: center;
561
- justify-content: center;
598
+ -webkit-box-pack: center;
599
+ -ms-flex-pack: center;
600
+ justify-content: center;
562
601
  white-space: nowrap;
563
602
  padding: 3px 11px 0;
564
- line-height: 18px;
565
- font-size: 12px;
566
603
  }
567
604
  .e-ribbon.e-rbn .e-ribbon-launcher-icon,
568
605
  .e-ribbon-group-overflow-ddb .e-ribbon-launcher-icon {
@@ -591,22 +628,29 @@
591
628
  }
592
629
  .e-ribbon.e-rbn .e-ribbon-column,
593
630
  .e-ribbon-group-overflow-ddb .e-ribbon-column {
631
+ display: -webkit-inline-box;
594
632
  display: -ms-inline-flexbox;
595
633
  display: inline-flex;
596
- -ms-flex-direction: row;
597
- flex-direction: row;
634
+ -webkit-box-orient: horizontal;
635
+ -webkit-box-direction: normal;
636
+ -ms-flex-direction: row;
637
+ flex-direction: row;
598
638
  }
599
639
  .e-ribbon.e-rbn .e-ribbon-row,
600
640
  .e-ribbon-group-overflow-ddb .e-ribbon-row {
641
+ display: -webkit-inline-box;
601
642
  display: -ms-inline-flexbox;
602
643
  display: inline-flex;
603
- -ms-flex-direction: column;
604
- flex-direction: column;
644
+ -webkit-box-orient: vertical;
645
+ -webkit-box-direction: normal;
646
+ -ms-flex-direction: column;
647
+ flex-direction: column;
605
648
  }
606
649
  .e-ribbon.e-rbn .e-ribbon-group-overflow,
607
650
  .e-ribbon.e-rbn .e-ribbon-item,
608
651
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow,
609
652
  .e-ribbon-group-overflow-ddb .e-ribbon-item {
653
+ display: -webkit-box;
610
654
  display: -ms-flexbox;
611
655
  display: flex;
612
656
  padding: 1px;
@@ -616,23 +660,29 @@
616
660
  .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-gallery-wrapper,
617
661
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-gallery-wrapper,
618
662
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-gallery-wrapper {
619
- height: 80px;
663
+ display: -webkit-box;
620
664
  display: -ms-flexbox;
621
665
  display: flex;
666
+ margin: 0;
622
667
  }
623
668
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item,
624
669
  .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item,
625
670
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item,
626
671
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item {
627
672
  max-height: 80px;
673
+ margin: 0;
674
+ border-radius: 0;
628
675
  }
629
676
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-ribbon-gallery-button,
630
677
  .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-gallery-button,
631
678
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-gallery-button,
632
679
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-gallery-button {
633
- padding: 0;
680
+ padding: 0 2px;
634
681
  border-width: 0 0 0 1px;
635
682
  border-radius: 0 4px 4px 0;
683
+ line-height: 12px;
684
+ font-weight: 400;
685
+ font-size: 12px;
636
686
  }
637
687
  .e-ribbon.e-rbn .e-ribbon-group-overflow.e-hidden,
638
688
  .e-ribbon.e-rbn .e-ribbon-item.e-hidden,
@@ -649,7 +699,8 @@
649
699
  font-weight: 400;
650
700
  font-size: 14px;
651
701
  text-transform: none;
652
- box-shadow: none;
702
+ -webkit-box-shadow: none;
703
+ box-shadow: none;
653
704
  }
654
705
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:focus,
655
706
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:focus,
@@ -671,21 +722,28 @@
671
722
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-large-item .e-btn,
672
723
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item .e-btn,
673
724
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-btn {
674
- max-width: 10ch;
725
+ height: 100%;
675
726
  min-height: inherit;
727
+ display: -webkit-box;
728
+ display: -ms-flexbox;
729
+ display: flex;
730
+ -webkit-box-orient: vertical;
731
+ -webkit-box-direction: normal;
732
+ -ms-flex-direction: column;
733
+ flex-direction: column;
734
+ max-width: 10ch;
735
+ min-width: -webkit-fit-content;
736
+ min-width: -moz-fit-content;
676
737
  min-width: fit-content;
677
738
  white-space: normal;
678
739
  padding: 0 5px;
679
740
  line-height: 22px;
680
- height: 100%;
681
- display: -ms-flexbox;
682
- display: flex;
683
- -ms-flex-direction: column;
684
- flex-direction: column;
685
- -ms-flex-pack: start;
686
- justify-content: flex-start;
687
- -ms-flex-align: center;
688
- align-items: center;
741
+ -webkit-box-pack: start;
742
+ -ms-flex-pack: start;
743
+ justify-content: flex-start;
744
+ -webkit-box-align: center;
745
+ -ms-flex-align: center;
746
+ align-items: center;
689
747
  }
690
748
  .e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-large-item .e-btn.e-ribbon-group-overflow-ddb,
691
749
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-large-item .e-btn.e-ribbon-group-overflow-ddb,
@@ -717,17 +775,24 @@
717
775
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-large-item > .e-split-btn-wrapper.e-vertical .e-btn,
718
776
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item > .e-split-btn-wrapper.e-vertical .e-btn,
719
777
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item > .e-split-btn-wrapper.e-vertical .e-btn {
720
- -ms-flex-pack: space-evenly;
721
- justify-content: space-evenly;
778
+ -webkit-box-pack: space-evenly;
779
+ -ms-flex-pack: space-evenly;
780
+ justify-content: space-evenly;
722
781
  height: 50%;
723
782
  }
783
+ .e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-large-item > .e-split-btn-wrapper.e-vertical .e-btn .e-icon-top,
784
+ .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-large-item > .e-split-btn-wrapper.e-vertical .e-btn .e-icon-top,
785
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item > .e-split-btn-wrapper.e-vertical .e-btn .e-icon-top,
786
+ .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item > .e-split-btn-wrapper.e-vertical .e-btn .e-icon-top {
787
+ height: 100%;
788
+ }
724
789
  .e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-large-item .e-dropdown-btn .e-caret,
725
790
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-large-item .e-dropdown-btn .e-caret,
726
791
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item .e-dropdown-btn .e-caret,
727
792
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-dropdown-btn .e-caret {
728
793
  font-size: 12px;
729
- padding: 0 20px;
730
794
  line-height: 12px;
795
+ padding: 0 20px;
731
796
  }
732
797
  .e-ribbon.e-rbn .e-ribbon-group-overflow,
733
798
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow {
@@ -744,14 +809,26 @@
744
809
  padding: 0;
745
810
  border-style: solid;
746
811
  border-width: 1px;
747
- border-radius: 4px;
812
+ }
813
+ .e-ribbon.e-rbn .e-ribbon-item:has(.e-ribbon-gallery-container:not(.e-hidden)),
814
+ .e-ribbon-group-overflow-ddb .e-ribbon-item:has(.e-ribbon-gallery-container:not(.e-hidden)) {
815
+ height: 80px;
816
+ border-radius: 0;
748
817
  }
749
818
  .e-ribbon.e-rbn .e-ribbon-item .e-btn-group,
750
819
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group {
751
- box-shadow: none;
820
+ -webkit-box-shadow: none;
821
+ box-shadow: none;
752
822
  }
753
823
  .e-ribbon.e-rbn .e-ribbon-item .e-checkbox-wrapper,
754
824
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-checkbox-wrapper {
825
+ height: -webkit-fit-content;
826
+ height: -moz-fit-content;
827
+ height: fit-content;
828
+ margin: auto 0;
829
+ width: -webkit-max-content;
830
+ width: -moz-max-content;
831
+ width: max-content;
755
832
  padding: 0 10px;
756
833
  }
757
834
  .e-ribbon.e-rbn .e-ribbon-item .e-checkbox-wrapper .e-label,
@@ -760,18 +837,13 @@
760
837
  }
761
838
  .e-ribbon.e-rbn .e-ribbon-item .e-btn,
762
839
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn {
763
- box-shadow: none;
840
+ -webkit-box-shadow: none;
841
+ box-shadow: none;
764
842
  }
765
843
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:disabled,
766
844
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn:disabled {
767
845
  pointer-events: none;
768
846
  }
769
- .e-ribbon.e-rbn .e-ribbon-item .e-checkbox-wrapper,
770
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-checkbox-wrapper {
771
- height: fit-content;
772
- margin: auto 0;
773
- width: max-content;
774
- }
775
847
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper,
776
848
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper {
777
849
  border: 1px solid transparent;
@@ -785,7 +857,8 @@
785
857
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper {
786
858
  border: 1px solid transparent;
787
859
  border-radius: unset;
788
- box-shadow: none;
860
+ -webkit-box-shadow: none;
861
+ box-shadow: none;
789
862
  }
790
863
  .e-ribbon.e-rbn .e-ribbon-item .e-split-btn-wrapper .e-btn,
791
864
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper .e-btn {
@@ -842,8 +915,8 @@
842
915
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-dropdown-btn .e-caret,
843
916
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-dropdown-btn .e-caret {
844
917
  font-size: 12px;
845
- padding: 2px 4px;
846
918
  line-height: 12px;
919
+ padding: 2px 4px;
847
920
  margin: 0;
848
921
  width: auto;
849
922
  }
@@ -854,8 +927,10 @@
854
927
  }
855
928
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-btn,
856
929
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-btn {
857
- -ms-flex-align: center;
858
- align-items: center;
930
+ -webkit-box-align: center;
931
+ -ms-flex-align: center;
932
+ align-items: center;
933
+ display: -webkit-box;
859
934
  display: -ms-flexbox;
860
935
  display: flex;
861
936
  }
@@ -868,11 +943,6 @@
868
943
  margin: 10px;
869
944
  padding: 0;
870
945
  }
871
- .e-ribbon.e-rbn .e-ribbon-vertical-center:not(.e-ribbon-large-item),
872
- .e-ribbon-group-overflow-ddb .e-ribbon-vertical-center:not(.e-ribbon-large-item) {
873
- margin-bottom: auto;
874
- margin-top: auto;
875
- }
876
946
  .e-ribbon.e-rbn:not(.e-rtl) .e-ribbon-item.e-ribbon-small-item .e-btn:not(.e-icon-btn, .e-dropdown-btn), .e-ribbon.e-rbn:not(.e-rtl) .e-ribbon-item.e-ribbon-medium-item .e-btn:not(.e-icon-btn, .e-dropdown-btn),
877
947
  .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-item.e-ribbon-small-item .e-btn:not(.e-icon-btn, .e-dropdown-btn),
878
948
  .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-item.e-ribbon-medium-item .e-btn:not(.e-icon-btn, .e-dropdown-btn) {
@@ -906,12 +976,15 @@
906
976
  }
907
977
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-gallery-dropdown.e-btn {
908
978
  padding: 0;
979
+ display: -webkit-box;
909
980
  display: -ms-flexbox;
910
981
  display: flex;
911
- -ms-flex-align: center;
912
- align-items: center;
913
- -ms-flex-pack: start;
914
- justify-content: flex-start;
982
+ -webkit-box-align: center;
983
+ -ms-flex-align: center;
984
+ align-items: center;
985
+ -webkit-box-pack: start;
986
+ -ms-flex-pack: start;
987
+ justify-content: flex-start;
915
988
  width: 100%;
916
989
  }
917
990
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-gallery-dropdown.e-btn .e-btn-icon {
@@ -919,18 +992,12 @@
919
992
  }
920
993
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-gallery-wrapper.e-hidden,
921
994
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-gallery-container.e-hidden,
922
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-gallery-button.e-hidden {
923
- display: none;
924
- }
925
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hide-group {
926
- display: none;
927
- }
928
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-disabled {
929
- pointer-events: none;
930
- }
931
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hide-group {
995
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-gallery-button.e-hidden,
996
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden,
997
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hide-group, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hide-group {
932
998
  display: none;
933
999
  }
1000
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-disabled,
934
1001
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-disabled {
935
1002
  pointer-events: none;
936
1003
  }
@@ -943,16 +1010,19 @@
943
1010
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-combobox-label,
944
1011
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-colorpicker-label {
945
1012
  white-space: nowrap;
1013
+ display: -webkit-box;
946
1014
  display: -ms-flexbox;
947
1015
  display: flex;
948
- -ms-flex-align: center;
949
- align-items: center;
1016
+ -webkit-box-align: center;
1017
+ -ms-flex-align: center;
1018
+ align-items: center;
950
1019
  font-weight: 400;
951
1020
  font-size: 14px;
952
1021
  }
953
1022
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item:has(.e-colorpicker-wrapper) {
954
- -ms-flex-align: center;
955
- align-items: center;
1023
+ -webkit-box-align: center;
1024
+ -ms-flex-align: center;
1025
+ align-items: center;
956
1026
  }
957
1027
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
958
1028
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
@@ -984,14 +1054,15 @@
984
1054
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper .e-split-btn,
985
1055
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-btn {
986
1056
  width: 100%;
987
- -ms-flex-pack: start;
988
- justify-content: flex-start;
1057
+ -webkit-box-pack: start;
1058
+ -ms-flex-pack: start;
1059
+ justify-content: flex-start;
989
1060
  }
990
1061
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-overflow-header {
991
- padding: 6px 10px;
992
1062
  font-size: 14px;
993
1063
  font-weight: 600;
994
1064
  line-height: 16px;
1065
+ padding: 6px 10px;
995
1066
  height: 26px;
996
1067
  }
997
1068
 
@@ -1002,12 +1073,16 @@
1002
1073
  .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1003
1074
  padding: 8px 8px 8px 12px;
1004
1075
  }
1005
- .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper {
1076
+ .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
1077
+ padding-left: 38px;
1078
+ }
1079
+ .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper, .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-combobox-label)) .e-input-group.e-control-wrapper {
1006
1080
  margin-left: 38px;
1007
1081
  }
1008
1082
  .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1009
1083
  .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1010
- transform: rotate(-90deg);
1084
+ -webkit-transform: rotate(-90deg);
1085
+ transform: rotate(-90deg);
1011
1086
  padding: 0 9px 12px;
1012
1087
  margin: 0 0 0 auto;
1013
1088
  }
@@ -1022,12 +1097,16 @@
1022
1097
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1023
1098
  padding: 8px 12px 8px 8px;
1024
1099
  }
1025
- .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper {
1100
+ .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
1101
+ padding-right: 38px;
1102
+ }
1103
+ .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper, .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-combobox-label)) .e-input-group.e-control-wrapper {
1026
1104
  margin-right: 38px;
1027
1105
  }
1028
1106
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1029
1107
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1030
- transform: rotate(90deg);
1108
+ -webkit-transform: rotate(90deg);
1109
+ transform: rotate(90deg);
1031
1110
  padding: 12px 9px 0;
1032
1111
  margin: 0 auto 0 0;
1033
1112
  }
@@ -1035,11 +1114,6 @@
1035
1114
  margin: 4px;
1036
1115
  }
1037
1116
 
1038
- .e-dropdown-popup.e-ribbon-dropdown-group-button.e-ribbon-group-button-overflow-popup .e-btn-group:not(.e-icon-btn) {
1039
- -ms-flex-direction: column;
1040
- flex-direction: column;
1041
- }
1042
-
1043
1117
  .e-dropdown-popup.e-ribbon-dropdown-group-button {
1044
1118
  border-radius: 0;
1045
1119
  border: 1px solid;
@@ -1053,12 +1127,15 @@
1053
1127
  }
1054
1128
  .e-dropdown-popup.e-ribbon-dropdown-group-button.e-ribbon-group-button-overflow-popup .e-btn-group .e-btn.e-ribbon-group-button:not(.e-icon-btn) {
1055
1129
  width: 100%;
1130
+ display: -webkit-box;
1056
1131
  display: -ms-flexbox;
1057
1132
  display: flex;
1058
- -ms-flex-align: center;
1059
- align-items: center;
1060
- -ms-flex-pack: start;
1061
- justify-content: flex-start;
1133
+ -webkit-box-align: center;
1134
+ -ms-flex-align: center;
1135
+ align-items: center;
1136
+ -webkit-box-pack: start;
1137
+ -ms-flex-pack: start;
1138
+ justify-content: flex-start;
1062
1139
  }
1063
1140
  .e-dropdown-popup.e-ribbon-dropdown-group-button.e-ribbon-group-button-overflow-popup .e-btn-group:has(.e-ribbon-group-button-content) .e-btn.e-ribbon-group-button:first-of-type {
1064
1141
  border-top-right-radius: 4px;
@@ -1072,14 +1149,21 @@
1072
1149
  border-bottom-right-radius: 4px;
1073
1150
  border-bottom-left-radius: 4px;
1074
1151
  }
1152
+ .e-dropdown-popup.e-ribbon-dropdown-group-button.e-ribbon-group-button-overflow-popup .e-btn-group:not(.e-icon-btn) {
1153
+ -webkit-box-orient: vertical;
1154
+ -webkit-box-direction: normal;
1155
+ -ms-flex-direction: column;
1156
+ flex-direction: column;
1157
+ }
1075
1158
  .e-dropdown-popup.e-ribbon-dropdown-group-button .e-btn-group {
1076
- box-shadow: none;
1159
+ -webkit-box-shadow: none;
1160
+ box-shadow: none;
1077
1161
  border-radius: 0;
1078
1162
  }
1079
1163
  .e-dropdown-popup.e-ribbon-dropdown-group-button .e-btn-group .e-btn-icon {
1080
1164
  font-size: 16px;
1081
- line-height: 16px;
1082
1165
  font-weight: 400;
1166
+ line-height: 16px;
1083
1167
  margin: 10px;
1084
1168
  width: auto;
1085
1169
  }
@@ -1098,7 +1182,13 @@
1098
1182
  }
1099
1183
  .e-dropdown-popup.e-ribbon-dropdown-group-button .e-btn-group .e-btn.e-ribbon-group-button:focus, .e-dropdown-popup.e-ribbon-dropdown-group-button .e-btn-group .e-btn.e-ribbon-group-button:focus-visible {
1100
1184
  outline: none;
1101
- box-shadow: none !important; /* stylelint-disable-line declaration-no-important */
1185
+ -webkit-box-shadow: none !important;
1186
+ box-shadow: none !important; /* stylelint-disable-line declaration-no-important */
1187
+ }
1188
+
1189
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-popup-container .e-ribbon-gallery-header:first-child,
1190
+ .e-ribbon-gallery-dropdown.e-popup .e-ribbon-popup-container .e-ribbon-gallery-header:first-child {
1191
+ padding-top: 0;
1102
1192
  }
1103
1193
 
1104
1194
  .e-ribbon-gallery-popup.e-popup,
@@ -1109,14 +1199,14 @@
1109
1199
  }
1110
1200
  .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-header,
1111
1201
  .e-ribbon-gallery-dropdown.e-popup .e-ribbon-gallery-header {
1112
- padding: 9px;
1113
1202
  font-size: 12px;
1114
1203
  font-weight: 400;
1115
1204
  line-height: 24px;
1205
+ padding: 9px;
1116
1206
  }
1117
1207
  .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-container .e-ribbon-gallery-item,
1118
1208
  .e-ribbon-gallery-dropdown.e-popup .e-ribbon-gallery-container .e-ribbon-gallery-item {
1119
- margin: 4px;
1209
+ margin: 2px;
1120
1210
  height: 54px;
1121
1211
  width: 73px;
1122
1212
  }
@@ -1131,6 +1221,7 @@
1131
1221
  .e-ribbon-item .e-ribbon-gallery-container {
1132
1222
  padding: 0;
1133
1223
  margin: 0;
1224
+ display: -webkit-box;
1134
1225
  display: -ms-flexbox;
1135
1226
  display: flex;
1136
1227
  -ms-flex-line-pack: distribute;
@@ -1141,15 +1232,19 @@
1141
1232
  .e-ribbon-group-overflow .e-ribbon-gallery-container .e-ribbon-gallery-item,
1142
1233
  .e-ribbon-item .e-ribbon-gallery-container .e-ribbon-gallery-item {
1143
1234
  display: inherit;
1144
- -ms-flex-align: center;
1145
- align-items: center;
1146
- -ms-flex-pack: center;
1147
- justify-content: center;
1235
+ -webkit-box-orient: vertical;
1236
+ -webkit-box-direction: normal;
1237
+ -ms-flex-direction: column;
1238
+ flex-direction: column;
1239
+ -webkit-box-align: center;
1240
+ -ms-flex-align: center;
1241
+ align-items: center;
1242
+ -webkit-box-pack: center;
1243
+ -ms-flex-pack: center;
1244
+ justify-content: center;
1148
1245
  text-align: center;
1149
1246
  list-style-type: none;
1150
1247
  padding: 8px 0;
1151
- -ms-flex-direction: column;
1152
- flex-direction: column;
1153
1248
  cursor: pointer;
1154
1249
  border-width: 2px;
1155
1250
  border-style: solid;
@@ -1167,18 +1262,6 @@
1167
1262
  .e-ribbon-item .e-ribbon-gallery-container .e-ribbon-gallery-item.e-hidden {
1168
1263
  display: none;
1169
1264
  }
1170
- .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-container .e-ribbon-gallery-item .e-ribbon-gallery-text,
1171
- .e-ribbon-gallery-dropdown.e-popup .e-ribbon-gallery-container .e-ribbon-gallery-item .e-ribbon-gallery-text,
1172
- .e-ribbon-group-overflow .e-ribbon-gallery-container .e-ribbon-gallery-item .e-ribbon-gallery-text,
1173
- .e-ribbon-item .e-ribbon-gallery-container .e-ribbon-gallery-item .e-ribbon-gallery-text {
1174
- font-size: 12px;
1175
- font-weight: 400;
1176
- line-height: 22px;
1177
- width: inherit;
1178
- overflow: hidden;
1179
- white-space: nowrap;
1180
- text-overflow: ellipsis;
1181
- }
1182
1265
  .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-container .e-ribbon-gallery-item .e-ribbon-gallery-icons,
1183
1266
  .e-ribbon-gallery-dropdown.e-popup .e-ribbon-gallery-container .e-ribbon-gallery-item .e-ribbon-gallery-icons,
1184
1267
  .e-ribbon-group-overflow .e-ribbon-gallery-container .e-ribbon-gallery-item .e-ribbon-gallery-icons,
@@ -1199,19 +1282,33 @@
1199
1282
  border-radius: 4px;
1200
1283
  }
1201
1284
 
1285
+ .e-ribbon-gallery-text {
1286
+ font-size: 12px;
1287
+ font-weight: 400;
1288
+ line-height: 22px;
1289
+ width: inherit;
1290
+ overflow: hidden;
1291
+ white-space: nowrap;
1292
+ text-overflow: ellipsis;
1293
+ }
1294
+
1202
1295
  .e-ribbon-keytip {
1296
+ font-size: 14px;
1297
+ line-height: 18px;
1203
1298
  min-width: 20px;
1204
1299
  height: 20px;
1205
- line-height: 18px;
1206
- font-size: 14px;
1300
+ border-radius: unset;
1207
1301
  }
1208
1302
  .e-ribbon-keytip.e-popup-open {
1303
+ display: -webkit-box;
1209
1304
  display: -ms-flexbox;
1210
1305
  display: flex;
1211
- -ms-flex-pack: center;
1212
- justify-content: center;
1213
- -ms-flex-align: center;
1214
- align-items: center;
1306
+ -webkit-box-pack: center;
1307
+ -ms-flex-pack: center;
1308
+ justify-content: center;
1309
+ -webkit-box-align: center;
1310
+ -ms-flex-align: center;
1311
+ align-items: center;
1215
1312
  }
1216
1313
 
1217
1314
  .e-ribbon-menu {
@@ -1234,8 +1331,9 @@
1234
1331
  .e-ribbon-control.e-dropdown-popup ul .e-item {
1235
1332
  font-size: 16px;
1236
1333
  height: 36px;
1237
- -ms-flex-align: center;
1238
- align-items: center;
1334
+ -webkit-box-align: center;
1335
+ -ms-flex-align: center;
1336
+ align-items: center;
1239
1337
  }
1240
1338
  .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
1241
1339
  font-size: 16px;
@@ -1252,6 +1350,7 @@
1252
1350
  }
1253
1351
  .e-ribbon-tooltip .e-tip-content .e-ribbon-text-container {
1254
1352
  padding: 4px;
1353
+ display: -webkit-box;
1255
1354
  display: -ms-flexbox;
1256
1355
  display: flex;
1257
1356
  }
@@ -1273,9 +1372,9 @@
1273
1372
  .e-bigger.e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-backstage,
1274
1373
  .e-bigger .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu,
1275
1374
  .e-bigger .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-backstage {
1375
+ font-size: 16px;
1276
1376
  line-height: 24px;
1277
1377
  padding: 13px 15px;
1278
- font-size: 16px;
1279
1378
  }
1280
1379
  .e-bigger.e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-help-template,
1281
1380
  .e-bigger .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-help-template {
@@ -1302,8 +1401,8 @@
1302
1401
  .e-bigger.e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item .e-tab-text,
1303
1402
  .e-bigger .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item .e-tab-text {
1304
1403
  font-size: 16px;
1305
- padding: 13px 15px;
1306
1404
  line-height: 24px;
1405
+ padding: 13px 15px;
1307
1406
  }
1308
1407
  .e-bigger.e-ribbon.e-rbn .e-ribbon-tab.e-focused .e-tab-header .e-toolbar-item .e-tab-wrap:focus, .e-bigger.e-ribbon.e-rbn .e-ribbon-tab.e-focused .e-tab-header .e-toolbar-item .e-tab-wrap:focus .e-text-wrap,
1309
1408
  .e-bigger .e-ribbon.e-rbn .e-ribbon-tab.e-focused .e-tab-header .e-toolbar-item .e-tab-wrap:focus,
@@ -1316,8 +1415,8 @@
1316
1415
  }
1317
1416
  .e-bigger.e-ribbon.e-rbn.e-ribbon-collapsible .e-ribbon-collapse-btn,
1318
1417
  .e-bigger .e-ribbon.e-rbn.e-ribbon-collapsible .e-ribbon-collapse-btn {
1319
- line-height: 16px;
1320
1418
  font-size: 16px;
1419
+ line-height: 16px;
1321
1420
  padding: 4px;
1322
1421
  }
1323
1422
  .e-bigger.e-ribbon.e-rbn.e-ribbon-collapsible.e-ribbon-overflow .e-content,
@@ -1335,8 +1434,8 @@
1335
1434
  .e-bigger .e-ribbon.e-rbn.e-ribbon-collapsible.e-ribbon-overflow .e-ribbon-group-of-btn .e-btn-icon,
1336
1435
  .e-bigger .e-ribbon.e-rbn.e-ribbon-collapsible.e-ribbon-overflow .e-ribbon-overall-of-btn .e-btn-icon {
1337
1436
  font-size: 20px;
1338
- padding: 12px;
1339
1437
  line-height: 20px;
1438
+ padding: 12px;
1340
1439
  }
1341
1440
  .e-bigger.e-ribbon.e-rbn.e-ribbon-collapsible.e-ribbon-overflow .e-ribbon-overall-of-btn,
1342
1441
  .e-bigger .e-ribbon.e-rbn.e-ribbon-collapsible.e-ribbon-overflow .e-ribbon-overall-of-btn {
@@ -1350,14 +1449,35 @@
1350
1449
  .e-bigger .e-ribbon.e-rbn.e-ribbon-collapsible.e-ribbon-overflow.e-rtl .e-ribbon-overall-of-btn {
1351
1450
  left: 28px;
1352
1451
  }
1452
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-item:has(.e-ribbon-gallery-container:not(.e-hidden)),
1453
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-item:has(.e-ribbon-gallery-container:not(.e-hidden)) {
1454
+ height: 120px;
1455
+ }
1456
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-item:has(.e-ribbon-gallery-container),
1457
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-item:has(.e-ribbon-gallery-container) {
1458
+ padding: 0;
1459
+ }
1460
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-item .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item,
1461
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item {
1462
+ max-height: 120px;
1463
+ width: 120px;
1464
+ }
1465
+ .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-item:has(.e-ribbon-gallery-container:not(.e-hidden)),
1466
+ .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-item:has(.e-ribbon-gallery-container:not(.e-hidden)) {
1467
+ height: 40px;
1468
+ }
1469
+ .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-item .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item,
1470
+ .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-item .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item {
1471
+ max-height: 40px;
1472
+ }
1353
1473
 
1354
1474
  .e-bigger.e-ribbon.e-rbn .e-ribbon-group-header,
1355
1475
  .e-bigger .e-ribbon.e-rbn .e-ribbon-group-header,
1356
1476
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-group-header,
1357
1477
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-group-header {
1358
- padding: 8px 11px 6px;
1359
- line-height: 18px;
1360
1478
  font-size: 12px;
1479
+ line-height: 18px;
1480
+ padding: 8px 11px 6px;
1361
1481
  }
1362
1482
  .e-bigger.e-ribbon.e-rbn .e-ribbon-launcher-icon,
1363
1483
  .e-bigger .e-ribbon.e-rbn .e-ribbon-launcher-icon,
@@ -1406,7 +1526,7 @@
1406
1526
  .e-bigger .e-ribbon-group-overflow-ddb .e-input-group,
1407
1527
  .e-bigger.e-ribbon-group-overflow-ddb .e-input-group {
1408
1528
  height: 40px;
1409
- margin-bottom: 4px;
1529
+ margin: 0 0 4px;
1410
1530
  }
1411
1531
  .e-bigger.e-ribbon.e-rbn .e-input-group:not(.e-float-input) .e-input,
1412
1532
  .e-bigger .e-ribbon.e-rbn .e-input-group:not(.e-float-input) .e-input,
@@ -1418,9 +1538,9 @@
1418
1538
  .e-bigger .e-ribbon.e-rbn .e-input-group input.e-input,
1419
1539
  .e-bigger .e-ribbon-group-overflow-ddb .e-input-group input.e-input,
1420
1540
  .e-bigger.e-ribbon-group-overflow-ddb .e-input-group input.e-input {
1421
- padding: 9px 0 9px 12px;
1422
1541
  font-size: 14px;
1423
1542
  line-height: 22px;
1543
+ padding: 9px 0 9px 12px;
1424
1544
  height: auto;
1425
1545
  }
1426
1546
  .e-bigger.e-ribbon.e-rbn .e-input-group.e-control-wrapper .e-input-group-icon,
@@ -1463,9 +1583,10 @@
1463
1583
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-btn,
1464
1584
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item .e-btn,
1465
1585
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-btn {
1466
- padding: 0 5px;
1467
1586
  font-size: 16px;
1468
1587
  line-height: 24px;
1588
+ padding: 0 5px;
1589
+ max-width: 10ch;
1469
1590
  }
1470
1591
  .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
1471
1592
  .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
@@ -1546,8 +1667,8 @@
1546
1667
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon,
1547
1668
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon {
1548
1669
  font-size: 20px;
1549
- margin: 10px;
1550
1670
  line-height: 20px;
1671
+ margin: 10px;
1551
1672
  }
1552
1673
  .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-medium-item .e-split-colorpicker.e-split-btn, .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-small-item .e-split-colorpicker.e-split-btn,
1553
1674
  .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-split-colorpicker.e-split-btn,
@@ -1601,8 +1722,8 @@
1601
1722
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-dropdown-btn .e-caret,
1602
1723
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-dropdown-btn .e-caret {
1603
1724
  font-size: 16px;
1604
- padding: 3px 5px;
1605
1725
  line-height: 16px;
1726
+ padding: 3px 5px;
1606
1727
  margin: 0;
1607
1728
  }
1608
1729
 
@@ -1617,9 +1738,9 @@
1617
1738
 
1618
1739
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-overflow-header,
1619
1740
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-overflow-header {
1741
+ font-size: 16px;
1620
1742
  line-height: 20px;
1621
1743
  height: 36px;
1622
- font-size: 16px;
1623
1744
  }
1624
1745
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-dropdown-btn .e-caret,
1625
1746
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-dropdown-btn .e-caret {
@@ -1643,8 +1764,9 @@
1643
1764
  }
1644
1765
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item:has(.e-colorpicker-wrapper),
1645
1766
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item:has(.e-colorpicker-wrapper) {
1646
- -ms-flex-align: center;
1647
- align-items: center;
1767
+ -webkit-box-align: center;
1768
+ -ms-flex-align: center;
1769
+ align-items: center;
1648
1770
  }
1649
1771
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-combobox-label,
1650
1772
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-colorpicker-label,
@@ -1677,8 +1799,13 @@
1677
1799
  .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1678
1800
  padding: 10px 12px 10px 16px;
1679
1801
  }
1680
- .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper,
1681
- .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper {
1802
+ .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)),
1803
+ .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
1804
+ padding-left: 42px;
1805
+ }
1806
+ .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper, .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-combobox-label)) .e-input-group.e-control-wrapper,
1807
+ .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper,
1808
+ .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-combobox-label)) .e-input-group.e-control-wrapper {
1682
1809
  margin-left: 42px;
1683
1810
  }
1684
1811
  .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
@@ -1701,8 +1828,13 @@
1701
1828
  .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1702
1829
  padding: 10px 16px 10px 12px;
1703
1830
  }
1704
- .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper,
1705
- .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper {
1831
+ .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)),
1832
+ .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
1833
+ padding-right: 42px;
1834
+ }
1835
+ .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper, .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-combobox-label)) .e-input-group.e-control-wrapper,
1836
+ .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper,
1837
+ .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-combobox-label)) .e-input-group.e-control-wrapper {
1706
1838
  margin-right: 42px;
1707
1839
  }
1708
1840
  .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
@@ -1796,13 +1928,22 @@
1796
1928
  .e-bigger .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-header,
1797
1929
  .e-bigger.e-ribbon-gallery-dropdown.e-popup .e-ribbon-gallery-header,
1798
1930
  .e-bigger .e-ribbon-gallery-dropdown.e-popup .e-ribbon-gallery-header {
1799
- padding-bottom: 6px;
1800
1931
  font-size: 14px;
1801
1932
  line-height: 20px;
1933
+ padding: 6px;
1934
+ }
1935
+
1936
+ .e-bigger.e-ribbon-keytip,
1937
+ .e-bigger .e-ribbon-keytip {
1938
+ font-size: 14px;
1939
+ line-height: 18px;
1940
+ min-width: 20px;
1941
+ height: 20px;
1802
1942
  }
1803
1943
 
1804
1944
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header {
1805
1945
  border-color: #757575;
1946
+ background: #fff;
1806
1947
  }
1807
1948
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item.e-ribbon-contextual-tab {
1808
1949
  background: #fff;
@@ -1852,8 +1993,8 @@
1852
1993
  }
1853
1994
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu,
1854
1995
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-backstage {
1855
- color: #000;
1856
1996
  background: #fff;
1997
+ color: #000;
1857
1998
  border-color: #757575;
1858
1999
  }
1859
2000
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu.e-active,
@@ -1871,6 +2012,7 @@
1871
2012
  }
1872
2013
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-help-template {
1873
2014
  border-color: #757575;
2015
+ background: #fff;
1874
2016
  }
1875
2017
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-template:focus-visible {
1876
2018
  background: unset;
@@ -1881,8 +2023,8 @@
1881
2023
  color: #000;
1882
2024
  }
1883
2025
  .e-ribbon.e-rbn .e-ribbon-collapse-btn {
1884
- color: #000;
1885
2026
  background: #fff;
2027
+ color: #000;
1886
2028
  border-color: transparent;
1887
2029
  }
1888
2030
  .e-ribbon.e-rbn .e-ribbon-collapse-btn:hover, .e-ribbon.e-rbn .e-ribbon-collapse-btn:focus-visible {
@@ -1892,7 +2034,8 @@
1892
2034
  }
1893
2035
 
1894
2036
  .e-ribbon-backstage-popup {
1895
- box-shadow: 0 6px 12px rgba(255, 255, 255, 0.175);
2037
+ -webkit-box-shadow: 0 6px 12px rgba(255, 255, 255, 0.175);
2038
+ box-shadow: 0 6px 12px rgba(255, 255, 255, 0.175);
1896
2039
  }
1897
2040
  .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper {
1898
2041
  background: #400074;
@@ -1934,24 +2077,24 @@
1934
2077
  }
1935
2078
  .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-vertical .e-menu-item:focus, .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-ul .e-menu-item:focus {
1936
2079
  background: #400074;
1937
- border-color: #fff;
1938
2080
  color: #fff;
2081
+ border-color: #fff;
1939
2082
  }
1940
2083
  .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-vertical .e-menu-item:focus .e-menu-icon, .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-ul .e-menu-item:focus .e-menu-icon {
1941
2084
  color: #fff;
1942
2085
  }
1943
2086
  .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-selected, .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-vertical .e-menu-item:hover, .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-ul .e-menu-item.e-selected, .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-ul .e-menu-item:hover {
1944
2087
  background: #ecf;
1945
- border-color: #000;
1946
2088
  color: #000;
2089
+ border-color: #000;
1947
2090
  }
1948
2091
  .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-selected .e-menu-icon, .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-vertical .e-menu-item:hover .e-menu-icon, .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-ul .e-menu-item.e-selected .e-menu-icon, .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-ul .e-menu-item:hover .e-menu-icon {
1949
2092
  color: #000;
1950
2093
  }
1951
2094
  .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-selected:focus, .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-ul .e-menu-item.e-selected:focus {
1952
2095
  background: #400074;
1953
- border-color: #fff;
1954
2096
  color: #fff;
2097
+ border-color: #fff;
1955
2098
  }
1956
2099
  .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-selected:focus .e-menu-icon, .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-ul .e-menu-item.e-selected:focus .e-menu-icon {
1957
2100
  color: #fff;
@@ -1975,11 +2118,10 @@
1975
2118
  color: #757575;
1976
2119
  }
1977
2120
  .e-ribbon.e-rbn .e-ribbon-item:not(.e-disabled) .e-colorpicker-wrapper.e-ribbon-hover, .e-ribbon.e-rbn .e-ribbon-item:not(.e-disabled) .e-colorpicker-wrapper.e-ribbon-open,
2121
+ .e-ribbon.e-rbn .e-ribbon-item:not(.e-disabled) .e-split-btn-wrapper.e-ribbon-hover,
2122
+ .e-ribbon.e-rbn .e-ribbon-item:not(.e-disabled) .e-split-btn-wrapper.e-ribbon-open,
1978
2123
  .e-ribbon-group-overflow-ddb .e-ribbon-item:not(.e-disabled) .e-colorpicker-wrapper.e-ribbon-hover,
1979
- .e-ribbon-group-overflow-ddb .e-ribbon-item:not(.e-disabled) .e-colorpicker-wrapper.e-ribbon-open {
1980
- border-color: #ecf;
1981
- }
1982
- .e-ribbon.e-rbn .e-ribbon-item:not(.e-disabled) .e-split-btn-wrapper.e-ribbon-hover, .e-ribbon.e-rbn .e-ribbon-item:not(.e-disabled) .e-split-btn-wrapper.e-ribbon-open,
2124
+ .e-ribbon-group-overflow-ddb .e-ribbon-item:not(.e-disabled) .e-colorpicker-wrapper.e-ribbon-open,
1983
2125
  .e-ribbon-group-overflow-ddb .e-ribbon-item:not(.e-disabled) .e-split-btn-wrapper.e-ribbon-hover,
1984
2126
  .e-ribbon-group-overflow-ddb .e-ribbon-item:not(.e-disabled) .e-split-btn-wrapper.e-ribbon-open {
1985
2127
  border-color: #ecf;
@@ -1995,6 +2137,7 @@
1995
2137
  .e-ribbon.e-rbn .e-ribbon-item:has(.e-ribbon-gallery-container),
1996
2138
  .e-ribbon-group-overflow-ddb .e-ribbon-item:has(.e-ribbon-gallery-container) {
1997
2139
  border-color: #fff;
2140
+ background: #fff;
1998
2141
  }
1999
2142
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu),
2000
2143
  .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button,
@@ -2019,8 +2162,8 @@
2019
2162
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button,
2020
2163
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type),
2021
2164
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-ribbon-group-of-btn {
2022
- color: #000;
2023
2165
  background: #fff;
2166
+ color: #000;
2024
2167
  border-color: transparent;
2025
2168
  }
2026
2169
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu) .e-btn-icon,
@@ -2100,98 +2243,105 @@
2100
2243
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-ribbon-group-of-btn:hover .e-btn-icon {
2101
2244
  color: #000;
2102
2245
  }
2103
- .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu).e-active, .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu):active,
2246
+ .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu).e-active,
2104
2247
  .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button.e-active,
2105
- .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:active,
2106
2248
  .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active,
2107
- .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active,
2108
2249
  .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-group-of-btn.e-active,
2109
- .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-group-of-btn:active,
2110
2250
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu).e-active,
2111
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu):active,
2112
2251
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active,
2113
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:active,
2114
2252
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active,
2115
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active,
2116
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-ribbon-group-of-btn.e-active,
2117
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-ribbon-group-of-btn:active, .e-ribbon.e-rbn.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu).e-active, .e-ribbon.e-rbn.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu):active,
2253
+ .e-ribbon.e-rbn .e-ribbon-group-overflow .e-ribbon-group-of-btn.e-active, .e-ribbon.e-rbn.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu).e-active,
2118
2254
  .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active,
2119
- .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:active,
2120
2255
  .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active,
2121
- .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active,
2122
2256
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn.e-active,
2123
- .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn:active,
2124
2257
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn:not(.e-ribbon-file-menu).e-active,
2125
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn:not(.e-ribbon-file-menu):active,
2126
2258
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button.e-active,
2127
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:active,
2128
2259
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active,
2129
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active,
2130
2260
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-group-of-btn.e-active,
2131
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-group-of-btn:active,
2132
2261
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu).e-active,
2133
- .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu):active,
2134
2262
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active,
2135
- .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:active,
2136
2263
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active,
2137
- .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active,
2138
2264
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-group-of-btn.e-active,
2139
- .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-group-of-btn:active,
2140
2265
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu).e-active,
2141
- .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu):active,
2142
2266
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active,
2143
- .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:active,
2144
2267
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active,
2268
+ .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-ribbon-group-of-btn.e-active {
2269
+ background: #ecf;
2270
+ color: #000;
2271
+ }
2272
+ .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2273
+ .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2274
+ .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active .e-btn-icon,
2275
+ .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-group-of-btn.e-active .e-btn-icon,
2276
+ .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2277
+ .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2278
+ .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active .e-btn-icon,
2279
+ .e-ribbon.e-rbn .e-ribbon-group-overflow .e-ribbon-group-of-btn.e-active .e-btn-icon, .e-ribbon.e-rbn.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2280
+ .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2281
+ .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active .e-btn-icon,
2282
+ .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn.e-active .e-btn-icon,
2283
+ .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2284
+ .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2285
+ .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active .e-btn-icon,
2286
+ .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-group-of-btn.e-active .e-btn-icon,
2287
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2288
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2289
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active .e-btn-icon,
2290
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-group-of-btn.e-active .e-btn-icon,
2291
+ .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2292
+ .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2293
+ .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active .e-btn-icon,
2294
+ .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-ribbon-group-of-btn.e-active .e-btn-icon {
2295
+ color: #000;
2296
+ }
2297
+ .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu):active,
2298
+ .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:active,
2299
+ .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active,
2300
+ .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-group-of-btn:active,
2301
+ .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu):active,
2302
+ .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:active,
2303
+ .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active,
2304
+ .e-ribbon.e-rbn .e-ribbon-group-overflow .e-ribbon-group-of-btn:active, .e-ribbon.e-rbn.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu):active,
2305
+ .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:active,
2306
+ .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active,
2307
+ .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn:active,
2308
+ .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn:not(.e-ribbon-file-menu):active,
2309
+ .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:active,
2310
+ .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active,
2311
+ .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-group-of-btn:active,
2312
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu):active,
2313
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:active,
2314
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active,
2315
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-group-of-btn:active,
2316
+ .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu):active,
2317
+ .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:active,
2145
2318
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active,
2146
- .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-ribbon-group-of-btn.e-active,
2147
2319
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-ribbon-group-of-btn:active {
2148
2320
  background: #ecf;
2149
2321
  color: #000;
2150
2322
  }
2151
- .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon, .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu):active .e-btn-icon,
2152
- .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2323
+ .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu):active .e-btn-icon,
2153
2324
  .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:active .e-btn-icon,
2154
- .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active .e-btn-icon,
2155
2325
  .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active .e-btn-icon,
2156
- .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-group-of-btn.e-active .e-btn-icon,
2157
2326
  .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-group-of-btn:active .e-btn-icon,
2158
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2159
2327
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu):active .e-btn-icon,
2160
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2161
2328
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:active .e-btn-icon,
2162
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active .e-btn-icon,
2163
2329
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active .e-btn-icon,
2164
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-ribbon-group-of-btn.e-active .e-btn-icon,
2165
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-ribbon-group-of-btn:active .e-btn-icon, .e-ribbon.e-rbn.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon, .e-ribbon.e-rbn.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu):active .e-btn-icon,
2166
- .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2330
+ .e-ribbon.e-rbn .e-ribbon-group-overflow .e-ribbon-group-of-btn:active .e-btn-icon, .e-ribbon.e-rbn.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu):active .e-btn-icon,
2167
2331
  .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:active .e-btn-icon,
2168
- .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active .e-btn-icon,
2169
2332
  .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active .e-btn-icon,
2170
- .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn.e-active .e-btn-icon,
2171
2333
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn:active .e-btn-icon,
2172
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2173
2334
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn:not(.e-ribbon-file-menu):active .e-btn-icon,
2174
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2175
2335
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:active .e-btn-icon,
2176
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active .e-btn-icon,
2177
2336
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active .e-btn-icon,
2178
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-group-of-btn.e-active .e-btn-icon,
2179
2337
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-group-of-btn:active .e-btn-icon,
2180
- .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2181
2338
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu):active .e-btn-icon,
2182
- .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2183
2339
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:active .e-btn-icon,
2184
- .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active .e-btn-icon,
2185
2340
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active .e-btn-icon,
2186
- .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-group-of-btn.e-active .e-btn-icon,
2187
2341
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-group-of-btn:active .e-btn-icon,
2188
- .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2189
2342
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu):active .e-btn-icon,
2190
- .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2191
2343
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:active .e-btn-icon,
2192
- .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active .e-btn-icon,
2193
2344
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active .e-btn-icon,
2194
- .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-ribbon-group-of-btn.e-active .e-btn-icon,
2195
2345
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-ribbon-group-of-btn:active .e-btn-icon {
2196
2346
  color: #000;
2197
2347
  }
@@ -2221,6 +2371,8 @@
2221
2371
  background: unset;
2222
2372
  color: #000;
2223
2373
  border-color: #000;
2374
+ -webkit-box-shadow: none;
2375
+ box-shadow: none;
2224
2376
  }
2225
2377
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu):focus-visible .e-btn-icon,
2226
2378
  .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:focus-visible .e-btn-icon,
@@ -2383,7 +2535,8 @@
2383
2535
  .e-ribbon-group-overflow-ddb.e-dropdown-popup,
2384
2536
  .e-ribbon-dropdown-group-button.e-dropdown-popup {
2385
2537
  background: #fff;
2386
- box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.25);
2538
+ -webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.25);
2539
+ box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.25);
2387
2540
  border-color: #757575;
2388
2541
  }
2389
2542
  .e-ribbon-file-menu.e-dropdown-popup .e-btn:not(.e-ribbon-file-menu),
@@ -2401,57 +2554,80 @@
2401
2554
  background: transparent;
2402
2555
  }
2403
2556
 
2404
- .e-ribbon-gallery-item {
2405
- background: #ecf;
2406
- border-color: transparent;
2557
+ .e-ribbon-gallery-button {
2558
+ border-color: #fff;
2559
+ background: transparent;
2560
+ color: #ecf;
2407
2561
  }
2408
- .e-ribbon-gallery-item:hover {
2409
- background: unset;
2562
+ .e-ribbon-gallery-button.e-gallery-button-active {
2563
+ background: #ecf;
2564
+ color: #ecf;
2410
2565
  }
2411
- .e-ribbon-gallery-item.e-ribbon-gallery-selected {
2566
+
2567
+ .e-ribbon-gallery-item {
2412
2568
  background: #ecf;
2569
+ border-color: transparent;
2413
2570
  }
2414
- .e-ribbon-gallery-item.e-ribbon-gallery-selected .e-ribbon-gallery-text {
2571
+ .e-ribbon-gallery-item .e-ribbon-gallery-text {
2415
2572
  color: #000;
2416
2573
  }
2417
- .e-ribbon-gallery-item.e-ribbon-gallery-selected .e-ribbon-gallery-icons {
2574
+ .e-ribbon-gallery-item .e-ribbon-gallery-icons {
2418
2575
  color: #000;
2419
2576
  }
2420
- .e-ribbon-gallery-item.e-disabled {
2577
+
2578
+ .e-ribbon-gallery-popup.e-popup,
2579
+ .e-dropdown-popup.e-ribbon-gallery-dropdown {
2421
2580
  background: #fff;
2581
+ -webkit-box-shadow: 0 6px 12px rgba(255, 255, 255, 0.175);
2582
+ box-shadow: 0 6px 12px rgba(255, 255, 255, 0.175);
2422
2583
  }
2423
- .e-ribbon-gallery-item.e-disabled .e-ribbon-gallery-text {
2584
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-header,
2585
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-header {
2424
2586
  color: #000;
2425
2587
  }
2426
- .e-ribbon-gallery-item.e-disabled .e-ribbon-gallery-icons {
2427
- color: #000;
2588
+
2589
+ .e-ribbon-gallery-wrapper .e-ribbon-gallery-item:hover,
2590
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item:hover,
2591
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item:hover {
2592
+ background: unset;
2428
2593
  }
2429
- .e-ribbon-gallery-item:focus, .e-ribbon-gallery-item:focus-visible {
2430
- border-color: #fff;
2594
+ .e-ribbon-gallery-wrapper .e-ribbon-gallery-item.e-ribbon-gallery-selected,
2595
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item.e-ribbon-gallery-selected,
2596
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item.e-ribbon-gallery-selected {
2597
+ background: #ecf;
2431
2598
  }
2432
- .e-ribbon-gallery-item .e-ribbon-gallery-text {
2599
+ .e-ribbon-gallery-wrapper .e-ribbon-gallery-item.e-ribbon-gallery-selected .e-ribbon-gallery-text,
2600
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item.e-ribbon-gallery-selected .e-ribbon-gallery-text,
2601
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item.e-ribbon-gallery-selected .e-ribbon-gallery-text {
2433
2602
  color: #000;
2434
2603
  }
2435
- .e-ribbon-gallery-item .e-ribbon-gallery-icons {
2604
+ .e-ribbon-gallery-wrapper .e-ribbon-gallery-item.e-ribbon-gallery-selected .e-ribbon-gallery-icons,
2605
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item.e-ribbon-gallery-selected .e-ribbon-gallery-icons,
2606
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item.e-ribbon-gallery-selected .e-ribbon-gallery-icons {
2436
2607
  color: #000;
2437
2608
  }
2438
-
2439
- .e-ribbon-gallery-button {
2440
- border-color: #fff;
2441
- }
2442
- .e-ribbon-gallery-button.e-gallery-button-active {
2443
- background: #ecf;
2444
- }
2445
-
2446
- .e-ribbon-gallery-popup.e-popup,
2447
- .e-dropdown-popup.e-ribbon-gallery-dropdown {
2609
+ .e-ribbon-gallery-wrapper .e-ribbon-gallery-item.e-disabled,
2610
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item.e-disabled,
2611
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item.e-disabled {
2448
2612
  background: #fff;
2449
- box-shadow: 0 6px 12px rgba(255, 255, 255, 0.175);
2450
2613
  }
2451
- .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-header,
2452
- .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-header {
2614
+ .e-ribbon-gallery-wrapper .e-ribbon-gallery-item.e-disabled .e-ribbon-gallery-text,
2615
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item.e-disabled .e-ribbon-gallery-text,
2616
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item.e-disabled .e-ribbon-gallery-text {
2453
2617
  color: #000;
2454
2618
  }
2619
+ .e-ribbon-gallery-wrapper .e-ribbon-gallery-item.e-disabled .e-ribbon-gallery-icons,
2620
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item.e-disabled .e-ribbon-gallery-icons,
2621
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item.e-disabled .e-ribbon-gallery-icons {
2622
+ color: #000;
2623
+ }
2624
+ .e-ribbon-gallery-wrapper .e-ribbon-gallery-item:focus, .e-ribbon-gallery-wrapper .e-ribbon-gallery-item:focus-visible,
2625
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item:focus,
2626
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item:focus-visible,
2627
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item:focus,
2628
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item:focus-visible {
2629
+ border-color: #fff;
2630
+ }
2455
2631
 
2456
2632
  .e-dropdown-popup.e-ribbon-dropdown-group-button .e-btn-icon {
2457
2633
  color: #000;
@@ -2486,6 +2662,12 @@
2486
2662
  .e-dropdown-popup.e-ribbon-dropdown-group-button .e-btn.e-ribbon-group-button.e-active .e-btn-icon {
2487
2663
  color: #000;
2488
2664
  }
2665
+ .e-dropdown-popup.e-ribbon-dropdown-group-button .e-btn.e-ribbon-group-button.e-icon-btn:active, .e-dropdown-popup.e-ribbon-dropdown-group-button .e-btn.e-ribbon-group-button:active {
2666
+ background: #ecf;
2667
+ }
2668
+ .e-dropdown-popup.e-ribbon-dropdown-group-button .e-btn.e-ribbon-group-button.e-icon-btn:active .e-btn-icon, .e-dropdown-popup.e-ribbon-dropdown-group-button .e-btn.e-ribbon-group-button:active .e-btn-icon {
2669
+ color: #000;
2670
+ }
2489
2671
 
2490
2672
  .e-ribbon-tooltip.e-tooltip-wrap.e-popup {
2491
2673
  background: #fff;