@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
@@ -23,7 +23,8 @@
23
23
 
24
24
  .e-popup.e-ddl {
25
25
  border-radius: 4px;
26
- box-shadow: none;
26
+ -webkit-box-shadow: none;
27
+ box-shadow: none;
27
28
  margin-top: 3px;
28
29
  }
29
30
  .e-popup.e-ddl .e-input-group {
@@ -38,6 +39,7 @@
38
39
  }
39
40
 
40
41
  .e-popup.e-ddl .e-filter-parent .e-input-group {
42
+ display: -webkit-box;
41
43
  display: -ms-flexbox;
42
44
  display: flex;
43
45
  width: auto;
@@ -114,11 +116,13 @@
114
116
  .e-control.e-dropdownlist .e-input-group:not(.e-disabled) .e-input-group-icon:active,
115
117
  .e-ddl.e-popup .e-input-group:not(.e-disabled) .e-back-icon:active,
116
118
  .e-ddl.e-popup .e-input-group:not(.e-disabled) .e-clear-icon:active {
117
- box-shadow: none;
119
+ -webkit-box-shadow: none;
120
+ box-shadow: none;
118
121
  }
119
122
 
120
123
  .e-ddl.e-popup .e-input-group:not(.e-disabled) .e-clear-icon {
121
124
  background: transparent;
125
+ display: -webkit-box;
122
126
  display: -ms-flexbox;
123
127
  display: flex;
124
128
  position: relative;
@@ -179,15 +183,15 @@
179
183
  font-size: 10px;
180
184
  }
181
185
 
182
- /*! component's theme wise override definitions and variables */ /*! component's theme wise override definitions and variables */ /*! Horizontal Tab */
183
- /*! Bootstrap specific themes definition's */
184
- /*! Vertical Tab */
186
+ /*! component's theme wise override definitions and variables */
187
+ /*! component's theme wise override definitions and variables */
185
188
  .e-ribbon .e-drop-icon::before {
186
189
  content: "\e705";
187
190
  }
188
191
 
189
192
  .e-ribbon.e-rbn {
190
193
  display: block;
194
+ border-radius: unset;
191
195
  }
192
196
  .e-ribbon.e-rbn .e-ribbon-tab .e-toolbar {
193
197
  min-height: auto;
@@ -198,14 +202,15 @@
198
202
  }
199
203
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu,
200
204
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-backstage {
201
- position: absolute;
205
+ font-size: 14px;
206
+ font-weight: 400;
202
207
  line-height: 22px;
208
+ position: absolute;
203
209
  padding: 13px 12px;
204
210
  border: none;
205
211
  border-width: unset;
206
- font-size: 14px;
207
- font-weight: 400;
208
- box-shadow: none;
212
+ -webkit-box-shadow: none;
213
+ box-shadow: none;
209
214
  text-transform: none;
210
215
  }
211
216
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu.e-active,
@@ -215,16 +220,19 @@
215
220
  .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,
216
221
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-backstage.e-active,
217
222
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-backstage:focus {
218
- box-shadow: none;
223
+ -webkit-box-shadow: none;
224
+ box-shadow: none;
219
225
  outline: none;
220
226
  }
221
227
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-help-template {
222
228
  position: absolute;
223
229
  top: 0;
230
+ display: -webkit-box;
224
231
  display: -ms-flexbox;
225
232
  display: flex;
226
- -ms-flex-align: center;
227
- align-items: center;
233
+ -webkit-box-align: center;
234
+ -ms-flex-align: center;
235
+ align-items: center;
228
236
  height: 48px;
229
237
  padding-right: 12px;
230
238
  border-bottom: none;
@@ -244,8 +252,8 @@
244
252
  z-index: 1;
245
253
  }
246
254
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-items {
247
- min-height: auto;
248
255
  height: 48px;
256
+ min-height: auto;
249
257
  }
250
258
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-items:not(.e-tbar-pos) .e-toolbar-item:first-child,
251
259
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-items:not(.e-tbar-pos) .e-toolbar-item:last-child {
@@ -255,6 +263,11 @@
255
263
  vertical-align: unset;
256
264
  margin: 0;
257
265
  border: none;
266
+ border-radius: unset;
267
+ }
268
+ .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item:not(.e-separator) {
269
+ height: auto;
270
+ min-height: auto;
258
271
  }
259
272
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item.e-active {
260
273
  border: none;
@@ -268,12 +281,12 @@
268
281
  border: none;
269
282
  }
270
283
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item .e-tab-text {
271
- padding: 13px 12px;
284
+ font-size: 14px;
285
+ font-weight: 400;
272
286
  line-height: 22px;
287
+ padding: 13px 12px;
273
288
  text-transform: none;
274
289
  margin: 0;
275
- font-size: 14px;
276
- font-weight: 400;
277
290
  }
278
291
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item .e-text-wrap {
279
292
  height: auto;
@@ -281,12 +294,12 @@
281
294
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item.e-active .e-text-wrap::before {
282
295
  display: none;
283
296
  }
284
- .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item:not(.e-separator) {
285
- height: auto;
286
- min-height: auto;
297
+ .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item.e-active .e-text-wrap .e-tab-text {
298
+ font-weight: 400;
287
299
  }
288
300
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll.e-scroll-device .e-scroll-nav.e-scroll-right-nav {
289
- box-shadow: none;
301
+ -webkit-box-shadow: none;
302
+ box-shadow: none;
290
303
  }
291
304
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll {
292
305
  padding: 0;
@@ -297,7 +310,8 @@
297
310
  min-width: auto;
298
311
  width: auto;
299
312
  border-style: solid;
300
- transform: none;
313
+ -webkit-transform: none;
314
+ transform: none;
301
315
  border-width: 1px;
302
316
  border-radius: 2px;
303
317
  z-index: 3;
@@ -307,13 +321,14 @@
307
321
  }
308
322
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll .e-scroll-nav .e-nav-arrow {
309
323
  font-size: 20px;
310
- height: auto;
311
- transform: none;
324
+ font-weight: 400;
312
325
  line-height: 20px;
326
+ height: auto;
327
+ -webkit-transform: none;
328
+ transform: none;
313
329
  padding: 0 2px;
314
330
  width: auto;
315
331
  letter-spacing: unset;
316
- font-weight: 400;
317
332
  }
318
333
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll .e-scroll-nav .e-nav-arrow::before {
319
334
  font-size: 20px;
@@ -340,7 +355,8 @@
340
355
  border: none;
341
356
  }
342
357
  .e-ribbon.e-rbn .e-ribbon-collapse-btn:not(.e-ribbon-expand-btn) {
343
- transform: rotate(180deg);
358
+ -webkit-transform: rotate(180deg);
359
+ transform: rotate(180deg);
344
360
  }
345
361
  .e-ribbon.e-rbn.e-ribbon-overflow .e-content {
346
362
  width: calc(100% - 20px - 40px);
@@ -353,7 +369,8 @@
353
369
  border: none;
354
370
  height: 32px;
355
371
  margin: auto;
356
- box-shadow: none;
372
+ -webkit-box-shadow: none;
373
+ box-shadow: none;
357
374
  }
358
375
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn .e-btn-icon,
359
376
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn .e-btn-icon {
@@ -375,23 +392,27 @@
375
392
  bottom: 4px;
376
393
  position: absolute;
377
394
  }
395
+ .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn.e-ribbon-hide {
396
+ display: none;
397
+ }
378
398
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-container {
399
+ display: -webkit-inline-box;
379
400
  display: -ms-inline-flexbox;
380
401
  display: inline-flex;
381
402
  }
382
- .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn.e-ribbon-hide {
383
- display: none;
384
- }
385
403
  .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 {
386
404
  display: none;
387
405
  }
406
+ .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-item:has(.e-ribbon-gallery-container:not(.e-hidden)) {
407
+ height: 36px;
408
+ }
388
409
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-item .e-ribbon-gallery-wrapper {
389
- height: 30px;
410
+ margin: 5px 6px;
390
411
  }
391
412
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-item .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item {
392
- padding: 5px 0;
393
413
  width: 78px;
394
- margin: 2px;
414
+ margin: 0 2px;
415
+ border-radius: 4px;
395
416
  max-height: 26px;
396
417
  }
397
418
  .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 {
@@ -425,10 +446,12 @@
425
446
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content {
426
447
  padding: 0;
427
448
  height: 40px;
428
- -ms-flex-align: center;
429
- align-items: center;
449
+ -webkit-box-align: center;
450
+ -ms-flex-align: center;
451
+ align-items: center;
430
452
  }
431
453
  .e-ribbon.e-rbn .e-ribbon-tab-item {
454
+ display: -webkit-inline-box;
432
455
  display: -ms-inline-flexbox;
433
456
  display: inline-flex;
434
457
  }
@@ -486,29 +509,37 @@
486
509
  }
487
510
 
488
511
  .e-ribbon-backstage-popup.e-ribbon-backstage-open {
512
+ display: -webkit-box;
489
513
  display: -ms-flexbox;
490
514
  display: flex;
491
515
  }
492
-
493
516
  .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper {
517
+ display: -webkit-box;
494
518
  display: -ms-flexbox;
495
519
  display: flex;
496
- -ms-flex-direction: column;
497
- flex-direction: column;
520
+ -webkit-box-orient: vertical;
521
+ -webkit-box-direction: normal;
522
+ -ms-flex-direction: column;
523
+ flex-direction: column;
498
524
  }
499
525
  .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper .e-ribbon-backstage-items-wrapper {
526
+ display: -webkit-box;
500
527
  display: -ms-flexbox;
501
528
  display: flex;
502
- -ms-flex-direction: column;
503
- flex-direction: column;
504
- -ms-flex-pack: justify;
505
- justify-content: space-between;
529
+ -webkit-box-orient: vertical;
530
+ -webkit-box-direction: normal;
531
+ -ms-flex-direction: column;
532
+ flex-direction: column;
533
+ -webkit-box-pack: justify;
534
+ -ms-flex-pack: justify;
535
+ justify-content: space-between;
506
536
  height: 100%;
507
537
  }
508
538
  .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper .e-btn {
509
539
  border: none;
510
540
  border-radius: unset;
511
- box-shadow: none;
541
+ -webkit-box-shadow: none;
542
+ box-shadow: none;
512
543
  padding: unset;
513
544
  text-align: start;
514
545
  width: 100%;
@@ -516,10 +547,10 @@
516
547
  line-height: 48px;
517
548
  }
518
549
  .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper .e-btn .e-btn-icon {
519
- width: auto;
520
- margin: 0;
521
550
  font-size: 16px;
522
551
  line-height: 16px;
552
+ width: auto;
553
+ margin: 0;
523
554
  padding: 16px 12px 16px 16px;
524
555
  }
525
556
  .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper .e-btn:focus {
@@ -562,10 +593,10 @@
562
593
  border-width: 2px;
563
594
  }
564
595
  .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 {
565
- width: auto;
566
- margin-right: unset;
567
596
  font-size: 16px;
568
597
  line-height: 16px;
598
+ width: auto;
599
+ margin-right: unset;
569
600
  padding: 16px 12px 16px 16px;
570
601
  }
571
602
  .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 {
@@ -584,32 +615,36 @@
584
615
  .e-ribbon-group-overflow-ddb {
585
616
  border: none;
586
617
  }
618
+ .e-ribbon.e-rbn .e-disabled,
619
+ .e-ribbon-group-overflow-ddb .e-disabled {
620
+ opacity: 0.35;
621
+ }
587
622
  .e-ribbon.e-rbn .e-input-group,
588
623
  .e-ribbon-group-overflow-ddb .e-input-group {
589
624
  height: 32px;
590
625
  border-radius: 4px;
591
- margin-bottom: 4px;
626
+ margin: 0 0 4px;
592
627
  }
593
628
  .e-ribbon.e-rbn .e-input-group input.e-input,
594
629
  .e-ribbon-group-overflow-ddb .e-input-group input.e-input {
595
- padding: 5px 0 5px 8px;
596
630
  font-size: 14px;
597
- line-height: 22px;
598
631
  font-weight: 400;
632
+ line-height: 22px;
599
633
  height: auto;
600
634
  min-height: auto;
635
+ padding: 5px 0 5px 8px;
601
636
  }
602
637
  .e-ribbon.e-rbn .e-input-group.e-control-wrapper .e-input-group-icon,
603
638
  .e-ribbon-group-overflow-ddb .e-input-group.e-control-wrapper .e-input-group-icon {
604
639
  font-size: 16px;
640
+ font-weight: 400;
605
641
  line-height: 16px;
606
642
  height: auto;
643
+ min-height: auto;
607
644
  padding: 8px 2px 8px 2px;
608
645
  margin: 0;
609
- font-weight: 400;
610
646
  border: none;
611
647
  min-width: auto;
612
- min-height: auto;
613
648
  border-radius: unset;
614
649
  }
615
650
  .e-ribbon.e-rbn .e-input-group.e-control-wrapper .e-input-group-icon.e-ddl-icon,
@@ -636,16 +671,19 @@
636
671
  }
637
672
  .e-ribbon.e-rbn .e-ribbon-group-header,
638
673
  .e-ribbon-group-overflow-ddb .e-ribbon-group-header {
639
- -ms-flex-align: center;
640
- align-items: center;
674
+ font-size: 10px;
675
+ line-height: 15px;
676
+ -webkit-box-align: center;
677
+ -ms-flex-align: center;
678
+ align-items: center;
679
+ display: -webkit-box;
641
680
  display: -ms-flexbox;
642
681
  display: flex;
643
- -ms-flex-pack: center;
644
- justify-content: center;
682
+ -webkit-box-pack: center;
683
+ -ms-flex-pack: center;
684
+ justify-content: center;
645
685
  white-space: nowrap;
646
686
  padding: 0 11px 5px 11px;
647
- line-height: 15px;
648
- font-size: 10px;
649
687
  }
650
688
  .e-ribbon.e-rbn .e-ribbon-launcher-icon,
651
689
  .e-ribbon-group-overflow-ddb .e-ribbon-launcher-icon {
@@ -674,22 +712,29 @@
674
712
  }
675
713
  .e-ribbon.e-rbn .e-ribbon-column,
676
714
  .e-ribbon-group-overflow-ddb .e-ribbon-column {
715
+ display: -webkit-inline-box;
677
716
  display: -ms-inline-flexbox;
678
717
  display: inline-flex;
679
- -ms-flex-direction: row;
680
- flex-direction: row;
718
+ -webkit-box-orient: horizontal;
719
+ -webkit-box-direction: normal;
720
+ -ms-flex-direction: row;
721
+ flex-direction: row;
681
722
  }
682
723
  .e-ribbon.e-rbn .e-ribbon-row,
683
724
  .e-ribbon-group-overflow-ddb .e-ribbon-row {
725
+ display: -webkit-inline-box;
684
726
  display: -ms-inline-flexbox;
685
727
  display: inline-flex;
686
- -ms-flex-direction: column;
687
- flex-direction: column;
728
+ -webkit-box-orient: vertical;
729
+ -webkit-box-direction: normal;
730
+ -ms-flex-direction: column;
731
+ flex-direction: column;
688
732
  }
689
733
  .e-ribbon.e-rbn .e-ribbon-group-overflow,
690
734
  .e-ribbon.e-rbn .e-ribbon-item,
691
735
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow,
692
736
  .e-ribbon-group-overflow-ddb .e-ribbon-item {
737
+ display: -webkit-box;
693
738
  display: -ms-flexbox;
694
739
  display: flex;
695
740
  padding: 1px;
@@ -699,23 +744,29 @@
699
744
  .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-gallery-wrapper,
700
745
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-gallery-wrapper,
701
746
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-gallery-wrapper {
702
- height: 72px;
747
+ display: -webkit-box;
703
748
  display: -ms-flexbox;
704
749
  display: flex;
750
+ margin: 8px 10px;
705
751
  }
706
752
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item,
707
753
  .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item,
708
754
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item,
709
755
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item {
710
- max-height: 72px;
756
+ max-height: 92px;
757
+ margin: 0 2px;
758
+ border-radius: 8px;
711
759
  }
712
760
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-ribbon-gallery-button,
713
761
  .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-gallery-button,
714
762
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-gallery-button,
715
763
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-gallery-button {
716
- padding: 0;
764
+ padding: 0 3px;
717
765
  border-width: 0 0 0 1px;
718
766
  border-radius: 0 4px 4px 0;
767
+ line-height: 10px;
768
+ font-weight: 400;
769
+ font-size: 10px;
719
770
  }
720
771
  .e-ribbon.e-rbn .e-ribbon-group-overflow.e-hidden,
721
772
  .e-ribbon.e-rbn .e-ribbon-item.e-hidden,
@@ -732,7 +783,8 @@
732
783
  font-weight: 400;
733
784
  font-size: 14px;
734
785
  text-transform: none;
735
- box-shadow: none;
786
+ -webkit-box-shadow: none;
787
+ box-shadow: none;
736
788
  }
737
789
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:focus,
738
790
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:focus,
@@ -754,21 +806,28 @@
754
806
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-large-item .e-btn,
755
807
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item .e-btn,
756
808
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-btn {
757
- max-width: 10ch;
809
+ height: 100%;
758
810
  min-height: inherit;
811
+ display: -webkit-box;
812
+ display: -ms-flexbox;
813
+ display: flex;
814
+ -webkit-box-orient: vertical;
815
+ -webkit-box-direction: normal;
816
+ -ms-flex-direction: column;
817
+ flex-direction: column;
818
+ max-width: 10ch;
819
+ min-width: -webkit-fit-content;
820
+ min-width: -moz-fit-content;
759
821
  min-width: fit-content;
760
822
  white-space: normal;
761
823
  padding: 0 3px;
762
824
  line-height: 22px;
763
- height: 100%;
764
- display: -ms-flexbox;
765
- display: flex;
766
- -ms-flex-direction: column;
767
- flex-direction: column;
768
- -ms-flex-pack: start;
769
- justify-content: flex-start;
770
- -ms-flex-align: center;
771
- align-items: center;
825
+ -webkit-box-pack: start;
826
+ -ms-flex-pack: start;
827
+ justify-content: flex-start;
828
+ -webkit-box-align: center;
829
+ -ms-flex-align: center;
830
+ align-items: center;
772
831
  }
773
832
  .e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-large-item .e-btn.e-ribbon-group-overflow-ddb,
774
833
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-large-item .e-btn.e-ribbon-group-overflow-ddb,
@@ -800,17 +859,24 @@
800
859
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-large-item > .e-split-btn-wrapper.e-vertical .e-btn,
801
860
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item > .e-split-btn-wrapper.e-vertical .e-btn,
802
861
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item > .e-split-btn-wrapper.e-vertical .e-btn {
803
- -ms-flex-pack: space-evenly;
804
- justify-content: space-evenly;
862
+ -webkit-box-pack: space-evenly;
863
+ -ms-flex-pack: space-evenly;
864
+ justify-content: space-evenly;
805
865
  height: 50%;
806
866
  }
867
+ .e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-large-item > .e-split-btn-wrapper.e-vertical .e-btn .e-icon-top,
868
+ .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-large-item > .e-split-btn-wrapper.e-vertical .e-btn .e-icon-top,
869
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item > .e-split-btn-wrapper.e-vertical .e-btn .e-icon-top,
870
+ .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item > .e-split-btn-wrapper.e-vertical .e-btn .e-icon-top {
871
+ height: 100%;
872
+ }
807
873
  .e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-large-item .e-dropdown-btn .e-caret,
808
874
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-large-item .e-dropdown-btn .e-caret,
809
875
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item .e-dropdown-btn .e-caret,
810
876
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-dropdown-btn .e-caret {
811
877
  font-size: 16px;
812
- padding: 0 13px;
813
878
  line-height: 16px;
879
+ padding: 0 13px;
814
880
  }
815
881
  .e-ribbon.e-rbn .e-ribbon-group-overflow,
816
882
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow {
@@ -827,14 +893,26 @@
827
893
  padding: 0;
828
894
  border-style: solid;
829
895
  border-width: 1px;
896
+ }
897
+ .e-ribbon.e-rbn .e-ribbon-item:has(.e-ribbon-gallery-container:not(.e-hidden)),
898
+ .e-ribbon-group-overflow-ddb .e-ribbon-item:has(.e-ribbon-gallery-container:not(.e-hidden)) {
899
+ height: 108px;
830
900
  border-radius: 4px;
831
901
  }
832
902
  .e-ribbon.e-rbn .e-ribbon-item .e-btn-group,
833
903
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group {
834
- box-shadow: none;
904
+ -webkit-box-shadow: none;
905
+ box-shadow: none;
835
906
  }
836
907
  .e-ribbon.e-rbn .e-ribbon-item .e-checkbox-wrapper,
837
908
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-checkbox-wrapper {
909
+ height: -webkit-fit-content;
910
+ height: -moz-fit-content;
911
+ height: fit-content;
912
+ margin: auto 0;
913
+ width: -webkit-max-content;
914
+ width: -moz-max-content;
915
+ width: max-content;
838
916
  padding: 0 8px;
839
917
  }
840
918
  .e-ribbon.e-rbn .e-ribbon-item .e-checkbox-wrapper .e-label,
@@ -843,18 +921,13 @@
843
921
  }
844
922
  .e-ribbon.e-rbn .e-ribbon-item .e-btn,
845
923
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn {
846
- box-shadow: none;
924
+ -webkit-box-shadow: none;
925
+ box-shadow: none;
847
926
  }
848
927
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:disabled,
849
928
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn:disabled {
850
929
  pointer-events: none;
851
930
  }
852
- .e-ribbon.e-rbn .e-ribbon-item .e-checkbox-wrapper,
853
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-checkbox-wrapper {
854
- height: fit-content;
855
- margin: auto 0;
856
- width: max-content;
857
- }
858
931
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper,
859
932
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper {
860
933
  border: 1px solid transparent;
@@ -868,7 +941,8 @@
868
941
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper {
869
942
  border: 1px solid transparent;
870
943
  border-radius: 4px;
871
- box-shadow: none;
944
+ -webkit-box-shadow: none;
945
+ box-shadow: none;
872
946
  }
873
947
  .e-ribbon.e-rbn .e-ribbon-item .e-split-btn-wrapper .e-btn,
874
948
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper .e-btn {
@@ -925,8 +999,8 @@
925
999
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-dropdown-btn .e-caret,
926
1000
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-dropdown-btn .e-caret {
927
1001
  font-size: 16px;
928
- padding: 2px 4px;
929
1002
  line-height: 16px;
1003
+ padding: 2px 4px;
930
1004
  margin: 0;
931
1005
  width: auto;
932
1006
  }
@@ -937,8 +1011,10 @@
937
1011
  }
938
1012
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-btn,
939
1013
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-btn {
940
- -ms-flex-align: center;
941
- align-items: center;
1014
+ -webkit-box-align: center;
1015
+ -ms-flex-align: center;
1016
+ align-items: center;
1017
+ display: -webkit-box;
942
1018
  display: -ms-flexbox;
943
1019
  display: flex;
944
1020
  }
@@ -951,11 +1027,6 @@
951
1027
  margin: 8px;
952
1028
  padding: 0;
953
1029
  }
954
- .e-ribbon.e-rbn .e-ribbon-vertical-center:not(.e-ribbon-large-item),
955
- .e-ribbon-group-overflow-ddb .e-ribbon-vertical-center:not(.e-ribbon-large-item) {
956
- margin-bottom: auto;
957
- margin-top: auto;
958
- }
959
1030
  .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),
960
1031
  .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-item.e-ribbon-small-item .e-btn:not(.e-icon-btn, .e-dropdown-btn),
961
1032
  .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-item.e-ribbon-medium-item .e-btn:not(.e-icon-btn, .e-dropdown-btn) {
@@ -989,12 +1060,15 @@
989
1060
  }
990
1061
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-gallery-dropdown.e-btn {
991
1062
  padding: 0;
1063
+ display: -webkit-box;
992
1064
  display: -ms-flexbox;
993
1065
  display: flex;
994
- -ms-flex-align: center;
995
- align-items: center;
996
- -ms-flex-pack: start;
997
- justify-content: flex-start;
1066
+ -webkit-box-align: center;
1067
+ -ms-flex-align: center;
1068
+ align-items: center;
1069
+ -webkit-box-pack: start;
1070
+ -ms-flex-pack: start;
1071
+ justify-content: flex-start;
998
1072
  width: 100%;
999
1073
  }
1000
1074
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-gallery-dropdown.e-btn .e-btn-icon {
@@ -1002,18 +1076,12 @@
1002
1076
  }
1003
1077
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-gallery-wrapper.e-hidden,
1004
1078
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-gallery-container.e-hidden,
1005
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-gallery-button.e-hidden {
1006
- display: none;
1007
- }
1008
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hide-group {
1009
- display: none;
1010
- }
1011
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-disabled {
1012
- pointer-events: none;
1013
- }
1014
- .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 {
1079
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-gallery-button.e-hidden,
1080
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden,
1081
+ .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 {
1015
1082
  display: none;
1016
1083
  }
1084
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-disabled,
1017
1085
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-disabled {
1018
1086
  pointer-events: none;
1019
1087
  }
@@ -1026,16 +1094,19 @@
1026
1094
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-combobox-label,
1027
1095
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-colorpicker-label {
1028
1096
  white-space: nowrap;
1097
+ display: -webkit-box;
1029
1098
  display: -ms-flexbox;
1030
1099
  display: flex;
1031
- -ms-flex-align: center;
1032
- align-items: center;
1100
+ -webkit-box-align: center;
1101
+ -ms-flex-align: center;
1102
+ align-items: center;
1033
1103
  font-weight: 400;
1034
1104
  font-size: 14px;
1035
1105
  }
1036
1106
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item:has(.e-colorpicker-wrapper) {
1037
- -ms-flex-align: center;
1038
- align-items: center;
1107
+ -webkit-box-align: center;
1108
+ -ms-flex-align: center;
1109
+ align-items: center;
1039
1110
  }
1040
1111
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
1041
1112
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
@@ -1067,14 +1138,15 @@
1067
1138
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper .e-split-btn,
1068
1139
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-btn {
1069
1140
  width: 100%;
1070
- -ms-flex-pack: start;
1071
- justify-content: flex-start;
1141
+ -webkit-box-pack: start;
1142
+ -ms-flex-pack: start;
1143
+ justify-content: flex-start;
1072
1144
  }
1073
1145
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-overflow-header {
1074
- padding: 5px 0 5px 12px;
1075
1146
  font-size: 14px;
1076
1147
  font-weight: 400;
1077
1148
  line-height: 18px;
1149
+ padding: 5px 0 5px 12px;
1078
1150
  height: 24px;
1079
1151
  }
1080
1152
 
@@ -1085,12 +1157,16 @@
1085
1157
  .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 {
1086
1158
  padding: 7px 8px 7px 12px;
1087
1159
  }
1088
- .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper {
1160
+ .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)) {
1161
+ padding-left: 36px;
1162
+ }
1163
+ .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 {
1089
1164
  margin-left: 36px;
1090
1165
  }
1091
1166
  .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1092
1167
  .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1093
- transform: rotate(-90deg);
1168
+ -webkit-transform: rotate(-90deg);
1169
+ transform: rotate(-90deg);
1094
1170
  padding: 0 12px;
1095
1171
  margin: 0 0 0 auto;
1096
1172
  }
@@ -1105,12 +1181,16 @@
1105
1181
  .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 {
1106
1182
  padding: 7px 12px 7px 8px;
1107
1183
  }
1108
- .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper {
1184
+ .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)) {
1185
+ padding-right: 36px;
1186
+ }
1187
+ .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 {
1109
1188
  margin-right: 36px;
1110
1189
  }
1111
1190
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1112
1191
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1113
- transform: rotate(90deg);
1192
+ -webkit-transform: rotate(90deg);
1193
+ transform: rotate(90deg);
1114
1194
  padding: 0 12px;
1115
1195
  margin: 0 auto 0 0;
1116
1196
  }
@@ -1118,11 +1198,6 @@
1118
1198
  margin: 7px 12px 7px 0;
1119
1199
  }
1120
1200
 
1121
- .e-dropdown-popup.e-ribbon-dropdown-group-button.e-ribbon-group-button-overflow-popup .e-btn-group:not(.e-icon-btn) {
1122
- -ms-flex-direction: column;
1123
- flex-direction: column;
1124
- }
1125
-
1126
1201
  .e-dropdown-popup.e-ribbon-dropdown-group-button {
1127
1202
  border-radius: 4px;
1128
1203
  border: 1px solid;
@@ -1136,12 +1211,15 @@
1136
1211
  }
1137
1212
  .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) {
1138
1213
  width: 100%;
1214
+ display: -webkit-box;
1139
1215
  display: -ms-flexbox;
1140
1216
  display: flex;
1141
- -ms-flex-align: center;
1142
- align-items: center;
1143
- -ms-flex-pack: start;
1144
- justify-content: flex-start;
1217
+ -webkit-box-align: center;
1218
+ -ms-flex-align: center;
1219
+ align-items: center;
1220
+ -webkit-box-pack: start;
1221
+ -ms-flex-pack: start;
1222
+ justify-content: flex-start;
1145
1223
  }
1146
1224
  .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 {
1147
1225
  border-top-right-radius: 4px;
@@ -1155,14 +1233,21 @@
1155
1233
  border-bottom-right-radius: 4px;
1156
1234
  border-bottom-left-radius: 4px;
1157
1235
  }
1236
+ .e-dropdown-popup.e-ribbon-dropdown-group-button.e-ribbon-group-button-overflow-popup .e-btn-group:not(.e-icon-btn) {
1237
+ -webkit-box-orient: vertical;
1238
+ -webkit-box-direction: normal;
1239
+ -ms-flex-direction: column;
1240
+ flex-direction: column;
1241
+ }
1158
1242
  .e-dropdown-popup.e-ribbon-dropdown-group-button .e-btn-group {
1159
- box-shadow: none;
1243
+ -webkit-box-shadow: none;
1244
+ box-shadow: none;
1160
1245
  border-radius: 4px;
1161
1246
  }
1162
1247
  .e-dropdown-popup.e-ribbon-dropdown-group-button .e-btn-group .e-btn-icon {
1163
1248
  font-size: 16px;
1164
- line-height: 16px;
1165
1249
  font-weight: 400;
1250
+ line-height: 16px;
1166
1251
  margin: 8px;
1167
1252
  width: auto;
1168
1253
  }
@@ -1181,25 +1266,31 @@
1181
1266
  }
1182
1267
  .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 {
1183
1268
  outline: none;
1184
- box-shadow: none !important; /* stylelint-disable-line declaration-no-important */
1269
+ -webkit-box-shadow: none !important;
1270
+ box-shadow: none !important; /* stylelint-disable-line declaration-no-important */
1271
+ }
1272
+
1273
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-popup-container .e-ribbon-gallery-header:first-child,
1274
+ .e-ribbon-gallery-dropdown.e-popup .e-ribbon-popup-container .e-ribbon-gallery-header:first-child {
1275
+ padding-top: 0;
1185
1276
  }
1186
1277
 
1187
1278
  .e-ribbon-gallery-popup.e-popup,
1188
1279
  .e-ribbon-gallery-dropdown.e-popup {
1189
1280
  border-radius: 4px;
1190
- padding: 0 12px 12px;
1281
+ padding: 8px 12px 12px;
1191
1282
  overflow: auto;
1192
1283
  }
1193
1284
  .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-header,
1194
1285
  .e-ribbon-gallery-dropdown.e-popup .e-ribbon-gallery-header {
1195
- padding: 8px 0 4px;
1196
1286
  font-size: 14px;
1197
1287
  font-weight: 500;
1198
1288
  line-height: 22px;
1289
+ padding: 8px 0 4px;
1199
1290
  }
1200
1291
  .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-container .e-ribbon-gallery-item,
1201
1292
  .e-ribbon-gallery-dropdown.e-popup .e-ribbon-gallery-container .e-ribbon-gallery-item {
1202
- margin: 4px;
1293
+ margin: 2px;
1203
1294
  height: 54px;
1204
1295
  width: 73px;
1205
1296
  }
@@ -1214,6 +1305,7 @@
1214
1305
  .e-ribbon-item .e-ribbon-gallery-container {
1215
1306
  padding: 0;
1216
1307
  margin: 0;
1308
+ display: -webkit-box;
1217
1309
  display: -ms-flexbox;
1218
1310
  display: flex;
1219
1311
  -ms-flex-line-pack: distribute;
@@ -1224,15 +1316,19 @@
1224
1316
  .e-ribbon-group-overflow .e-ribbon-gallery-container .e-ribbon-gallery-item,
1225
1317
  .e-ribbon-item .e-ribbon-gallery-container .e-ribbon-gallery-item {
1226
1318
  display: inherit;
1227
- -ms-flex-align: center;
1228
- align-items: center;
1229
- -ms-flex-pack: center;
1230
- justify-content: center;
1319
+ -webkit-box-orient: vertical;
1320
+ -webkit-box-direction: normal;
1321
+ -ms-flex-direction: column;
1322
+ flex-direction: column;
1323
+ -webkit-box-align: center;
1324
+ -ms-flex-align: center;
1325
+ align-items: center;
1326
+ -webkit-box-pack: center;
1327
+ -ms-flex-pack: center;
1328
+ justify-content: center;
1231
1329
  text-align: center;
1232
1330
  list-style-type: none;
1233
1331
  padding: 5px 0;
1234
- -ms-flex-direction: column;
1235
- flex-direction: column;
1236
1332
  cursor: pointer;
1237
1333
  border-width: 2px;
1238
1334
  border-style: solid;
@@ -1250,18 +1346,6 @@
1250
1346
  .e-ribbon-item .e-ribbon-gallery-container .e-ribbon-gallery-item.e-hidden {
1251
1347
  display: none;
1252
1348
  }
1253
- .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-container .e-ribbon-gallery-item .e-ribbon-gallery-text,
1254
- .e-ribbon-gallery-dropdown.e-popup .e-ribbon-gallery-container .e-ribbon-gallery-item .e-ribbon-gallery-text,
1255
- .e-ribbon-group-overflow .e-ribbon-gallery-container .e-ribbon-gallery-item .e-ribbon-gallery-text,
1256
- .e-ribbon-item .e-ribbon-gallery-container .e-ribbon-gallery-item .e-ribbon-gallery-text {
1257
- font-size: 14px;
1258
- font-weight: 400;
1259
- line-height: 22px;
1260
- width: inherit;
1261
- overflow: hidden;
1262
- white-space: nowrap;
1263
- text-overflow: ellipsis;
1264
- }
1265
1349
  .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-container .e-ribbon-gallery-item .e-ribbon-gallery-icons,
1266
1350
  .e-ribbon-gallery-dropdown.e-popup .e-ribbon-gallery-container .e-ribbon-gallery-item .e-ribbon-gallery-icons,
1267
1351
  .e-ribbon-group-overflow .e-ribbon-gallery-container .e-ribbon-gallery-item .e-ribbon-gallery-icons,
@@ -1282,19 +1366,33 @@
1282
1366
  border-radius: 4px;
1283
1367
  }
1284
1368
 
1369
+ .e-ribbon-gallery-text {
1370
+ font-size: 14px;
1371
+ font-weight: 400;
1372
+ line-height: 22px;
1373
+ width: inherit;
1374
+ overflow: hidden;
1375
+ white-space: nowrap;
1376
+ text-overflow: ellipsis;
1377
+ }
1378
+
1285
1379
  .e-ribbon-keytip {
1380
+ font-size: 14px;
1381
+ line-height: 18px;
1286
1382
  min-width: 20px;
1287
1383
  height: 20px;
1288
- line-height: 18px;
1289
- font-size: 14px;
1384
+ border-radius: unset;
1290
1385
  }
1291
1386
  .e-ribbon-keytip.e-popup-open {
1387
+ display: -webkit-box;
1292
1388
  display: -ms-flexbox;
1293
1389
  display: flex;
1294
- -ms-flex-pack: center;
1295
- justify-content: center;
1296
- -ms-flex-align: center;
1297
- align-items: center;
1390
+ -webkit-box-pack: center;
1391
+ -ms-flex-pack: center;
1392
+ justify-content: center;
1393
+ -webkit-box-align: center;
1394
+ -ms-flex-align: center;
1395
+ align-items: center;
1298
1396
  }
1299
1397
 
1300
1398
  .e-ribbon-menu {
@@ -1317,8 +1415,9 @@
1317
1415
  .e-ribbon-control.e-dropdown-popup ul .e-item {
1318
1416
  font-size: 14px;
1319
1417
  height: 26px;
1320
- -ms-flex-align: center;
1321
- align-items: center;
1418
+ -webkit-box-align: center;
1419
+ -ms-flex-align: center;
1420
+ align-items: center;
1322
1421
  }
1323
1422
  .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
1324
1423
  font-size: 16px;
@@ -1335,6 +1434,7 @@
1335
1434
  }
1336
1435
  .e-ribbon-tooltip .e-tip-content .e-ribbon-text-container {
1337
1436
  padding: 4px;
1437
+ display: -webkit-box;
1338
1438
  display: -ms-flexbox;
1339
1439
  display: flex;
1340
1440
  }
@@ -1356,9 +1456,9 @@
1356
1456
  .e-bigger.e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-backstage,
1357
1457
  .e-bigger .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu,
1358
1458
  .e-bigger .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-backstage {
1459
+ font-size: 16px;
1359
1460
  line-height: 24px;
1360
1461
  padding: 14px 15px;
1361
- font-size: 16px;
1362
1462
  }
1363
1463
  .e-bigger.e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-help-template,
1364
1464
  .e-bigger .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-help-template {
@@ -1385,8 +1485,8 @@
1385
1485
  .e-bigger.e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item .e-tab-text,
1386
1486
  .e-bigger .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item .e-tab-text {
1387
1487
  font-size: 16px;
1388
- padding: 14px 15px;
1389
1488
  line-height: 24px;
1489
+ padding: 14px 15px;
1390
1490
  }
1391
1491
  .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,
1392
1492
  .e-bigger .e-ribbon.e-rbn .e-ribbon-tab.e-focused .e-tab-header .e-toolbar-item .e-tab-wrap:focus,
@@ -1399,8 +1499,8 @@
1399
1499
  }
1400
1500
  .e-bigger.e-ribbon.e-rbn.e-ribbon-collapsible .e-ribbon-collapse-btn,
1401
1501
  .e-bigger .e-ribbon.e-rbn.e-ribbon-collapsible .e-ribbon-collapse-btn {
1402
- line-height: 20px;
1403
1502
  font-size: 20px;
1503
+ line-height: 20px;
1404
1504
  padding: 2px;
1405
1505
  }
1406
1506
  .e-bigger.e-ribbon.e-rbn.e-ribbon-collapsible.e-ribbon-overflow .e-content,
@@ -1418,8 +1518,8 @@
1418
1518
  .e-bigger .e-ribbon.e-rbn.e-ribbon-collapsible.e-ribbon-overflow .e-ribbon-group-of-btn .e-btn-icon,
1419
1519
  .e-bigger .e-ribbon.e-rbn.e-ribbon-collapsible.e-ribbon-overflow .e-ribbon-overall-of-btn .e-btn-icon {
1420
1520
  font-size: 20px;
1421
- padding: 9px;
1422
1521
  line-height: 20px;
1522
+ padding: 9px;
1423
1523
  }
1424
1524
  .e-bigger.e-ribbon.e-rbn.e-ribbon-collapsible.e-ribbon-overflow .e-ribbon-overall-of-btn,
1425
1525
  .e-bigger .e-ribbon.e-rbn.e-ribbon-collapsible.e-ribbon-overflow .e-ribbon-overall-of-btn {
@@ -1433,14 +1533,35 @@
1433
1533
  .e-bigger .e-ribbon.e-rbn.e-ribbon-collapsible.e-ribbon-overflow.e-rtl .e-ribbon-overall-of-btn {
1434
1534
  left: 28px;
1435
1535
  }
1536
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-item:has(.e-ribbon-gallery-container:not(.e-hidden)),
1537
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-item:has(.e-ribbon-gallery-container:not(.e-hidden)) {
1538
+ height: 120px;
1539
+ }
1540
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-item:has(.e-ribbon-gallery-container),
1541
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-item:has(.e-ribbon-gallery-container) {
1542
+ padding: 0;
1543
+ }
1544
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-item .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item,
1545
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item {
1546
+ max-height: 104px;
1547
+ width: 104px;
1548
+ }
1549
+ .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-item:has(.e-ribbon-gallery-container:not(.e-hidden)),
1550
+ .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-item:has(.e-ribbon-gallery-container:not(.e-hidden)) {
1551
+ height: 40px;
1552
+ }
1553
+ .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,
1554
+ .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 {
1555
+ max-height: 30px;
1556
+ }
1436
1557
 
1437
1558
  .e-bigger.e-ribbon.e-rbn .e-ribbon-group-header,
1438
1559
  .e-bigger .e-ribbon.e-rbn .e-ribbon-group-header,
1439
1560
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-group-header,
1440
1561
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-group-header {
1441
- padding: 4px 11px 8px;
1442
- line-height: 15px;
1443
1562
  font-size: 12px;
1563
+ line-height: 15px;
1564
+ padding: 4px 11px 8px;
1444
1565
  }
1445
1566
  .e-bigger.e-ribbon.e-rbn .e-ribbon-launcher-icon,
1446
1567
  .e-bigger .e-ribbon.e-rbn .e-ribbon-launcher-icon,
@@ -1489,7 +1610,7 @@
1489
1610
  .e-bigger .e-ribbon-group-overflow-ddb .e-input-group,
1490
1611
  .e-bigger.e-ribbon-group-overflow-ddb .e-input-group {
1491
1612
  height: 38px;
1492
- margin-bottom: 6px;
1613
+ margin: 0 0 6px;
1493
1614
  }
1494
1615
  .e-bigger.e-ribbon.e-rbn .e-input-group:not(.e-float-input) .e-input,
1495
1616
  .e-bigger .e-ribbon.e-rbn .e-input-group:not(.e-float-input) .e-input,
@@ -1501,9 +1622,9 @@
1501
1622
  .e-bigger .e-ribbon.e-rbn .e-input-group input.e-input,
1502
1623
  .e-bigger .e-ribbon-group-overflow-ddb .e-input-group input.e-input,
1503
1624
  .e-bigger.e-ribbon-group-overflow-ddb .e-input-group input.e-input {
1504
- padding: 8px 0 8px 8px;
1505
1625
  font-size: 14px;
1506
1626
  line-height: 22px;
1627
+ padding: 8px 0 8px 8px;
1507
1628
  height: auto;
1508
1629
  }
1509
1630
  .e-bigger.e-ribbon.e-rbn .e-input-group.e-control-wrapper .e-input-group-icon,
@@ -1546,9 +1667,10 @@
1546
1667
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-btn,
1547
1668
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item .e-btn,
1548
1669
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-btn {
1549
- padding: 0 3px;
1550
1670
  font-size: 16px;
1551
1671
  line-height: 24px;
1672
+ padding: 0 3px;
1673
+ max-width: 10ch;
1552
1674
  }
1553
1675
  .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
1554
1676
  .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
@@ -1629,8 +1751,8 @@
1629
1751
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon,
1630
1752
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon {
1631
1753
  font-size: 20px;
1632
- margin: 9px;
1633
1754
  line-height: 20px;
1755
+ margin: 9px;
1634
1756
  }
1635
1757
  .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,
1636
1758
  .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-split-colorpicker.e-split-btn,
@@ -1684,8 +1806,8 @@
1684
1806
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-dropdown-btn .e-caret,
1685
1807
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-dropdown-btn .e-caret {
1686
1808
  font-size: 20px;
1687
- padding: 3px 4px;
1688
1809
  line-height: 16px;
1810
+ padding: 3px 4px;
1689
1811
  margin: 0;
1690
1812
  }
1691
1813
 
@@ -1700,9 +1822,9 @@
1700
1822
 
1701
1823
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-overflow-header,
1702
1824
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-overflow-header {
1825
+ font-size: 16px;
1703
1826
  line-height: 22px;
1704
1827
  height: 28px;
1705
- font-size: 16px;
1706
1828
  }
1707
1829
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-dropdown-btn .e-caret,
1708
1830
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-dropdown-btn .e-caret {
@@ -1710,7 +1832,7 @@
1710
1832
  }
1711
1833
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-input-group,
1712
1834
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-input-group {
1713
- height: 38px;
1835
+ height: 32px;
1714
1836
  }
1715
1837
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item,
1716
1838
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item {
@@ -1726,8 +1848,9 @@
1726
1848
  }
1727
1849
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item:has(.e-colorpicker-wrapper),
1728
1850
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item:has(.e-colorpicker-wrapper) {
1729
- -ms-flex-align: center;
1730
- align-items: center;
1851
+ -webkit-box-align: center;
1852
+ -ms-flex-align: center;
1853
+ align-items: center;
1731
1854
  }
1732
1855
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-combobox-label,
1733
1856
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-colorpicker-label,
@@ -1760,8 +1883,13 @@
1760
1883
  .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 {
1761
1884
  padding: 7px 10px 7px 16px;
1762
1885
  }
1763
- .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,
1764
- .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 {
1886
+ .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)),
1887
+ .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)) {
1888
+ padding-left: 44px;
1889
+ }
1890
+ .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,
1891
+ .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,
1892
+ .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 {
1765
1893
  margin-left: 44px;
1766
1894
  }
1767
1895
  .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,
@@ -1784,8 +1912,13 @@
1784
1912
  .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 {
1785
1913
  padding: 7px 16px 7px 10px;
1786
1914
  }
1787
- .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,
1788
- .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 {
1915
+ .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)),
1916
+ .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)) {
1917
+ padding-right: 44px;
1918
+ }
1919
+ .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,
1920
+ .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,
1921
+ .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 {
1789
1922
  margin-right: 44px;
1790
1923
  }
1791
1924
  .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
@@ -1873,19 +2006,28 @@
1873
2006
  .e-bigger .e-ribbon-gallery-popup.e-popup,
1874
2007
  .e-bigger.e-ribbon-gallery-dropdown.e-popup,
1875
2008
  .e-bigger .e-ribbon-gallery-dropdown.e-popup {
1876
- padding: 0 16px 16px;
2009
+ padding: 12px 16px 16px;
1877
2010
  }
1878
2011
  .e-bigger.e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-header,
1879
2012
  .e-bigger .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-header,
1880
2013
  .e-bigger.e-ribbon-gallery-dropdown.e-popup .e-ribbon-gallery-header,
1881
2014
  .e-bigger .e-ribbon-gallery-dropdown.e-popup .e-ribbon-gallery-header {
1882
- padding-bottom: 12px 0 8px;
1883
2015
  font-size: 16px;
1884
2016
  line-height: 24px;
2017
+ padding: 12px 0 8px;
2018
+ }
2019
+
2020
+ .e-bigger.e-ribbon-keytip,
2021
+ .e-bigger .e-ribbon-keytip {
2022
+ font-size: 14px;
2023
+ line-height: 18px;
2024
+ min-width: 20px;
2025
+ height: 20px;
1885
2026
  }
1886
2027
 
1887
2028
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header {
1888
2029
  border-color: unset;
2030
+ background: #f8f9fa;
1889
2031
  }
1890
2032
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item.e-ribbon-contextual-tab {
1891
2033
  background: #f8f9fa;
@@ -1935,8 +2077,8 @@
1935
2077
  }
1936
2078
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu,
1937
2079
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-backstage {
1938
- color: #212529;
1939
2080
  background: #f8f9fa;
2081
+ color: #212529;
1940
2082
  border-color: unset;
1941
2083
  }
1942
2084
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu.e-active,
@@ -1954,6 +2096,7 @@
1954
2096
  }
1955
2097
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-help-template {
1956
2098
  border-color: unset;
2099
+ background: #f8f9fa;
1957
2100
  }
1958
2101
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-template:focus-visible {
1959
2102
  background: #6c757d;
@@ -1964,8 +2107,8 @@
1964
2107
  color: #0056b3;
1965
2108
  }
1966
2109
  .e-ribbon.e-rbn .e-ribbon-collapse-btn {
1967
- color: #495057;
1968
2110
  background: #f8f9fa;
2111
+ color: #495057;
1969
2112
  border-color: transparent;
1970
2113
  }
1971
2114
  .e-ribbon.e-rbn .e-ribbon-collapse-btn:hover, .e-ribbon.e-rbn .e-ribbon-collapse-btn:focus-visible {
@@ -1975,7 +2118,8 @@
1975
2118
  }
1976
2119
 
1977
2120
  .e-ribbon-backstage-popup {
1978
- box-shadow: none;
2121
+ -webkit-box-shadow: none;
2122
+ box-shadow: none;
1979
2123
  }
1980
2124
  .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper {
1981
2125
  background: #007bff;
@@ -2017,24 +2161,24 @@
2017
2161
  }
2018
2162
  .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 {
2019
2163
  background: #007bff;
2020
- border-color: #fff;
2021
2164
  color: #fff;
2165
+ border-color: #fff;
2022
2166
  }
2023
2167
  .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 {
2024
2168
  color: #fff;
2025
2169
  }
2026
2170
  .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 {
2027
2171
  background: #fff;
2028
- border-color: unset;
2029
2172
  color: #007bff;
2173
+ border-color: unset;
2030
2174
  }
2031
2175
  .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 {
2032
2176
  color: #007bff;
2033
2177
  }
2034
2178
  .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 {
2035
2179
  background: #007bff;
2036
- border-color: #fff;
2037
2180
  color: #fff;
2181
+ border-color: #fff;
2038
2182
  }
2039
2183
  .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 {
2040
2184
  color: #fff;
@@ -2058,11 +2202,10 @@
2058
2202
  color: #6c757d;
2059
2203
  }
2060
2204
  .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,
2205
+ .e-ribbon.e-rbn .e-ribbon-item:not(.e-disabled) .e-split-btn-wrapper.e-ribbon-hover,
2206
+ .e-ribbon.e-rbn .e-ribbon-item:not(.e-disabled) .e-split-btn-wrapper.e-ribbon-open,
2061
2207
  .e-ribbon-group-overflow-ddb .e-ribbon-item:not(.e-disabled) .e-colorpicker-wrapper.e-ribbon-hover,
2062
- .e-ribbon-group-overflow-ddb .e-ribbon-item:not(.e-disabled) .e-colorpicker-wrapper.e-ribbon-open {
2063
- border-color: #6c757d;
2064
- }
2065
- .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,
2208
+ .e-ribbon-group-overflow-ddb .e-ribbon-item:not(.e-disabled) .e-colorpicker-wrapper.e-ribbon-open,
2066
2209
  .e-ribbon-group-overflow-ddb .e-ribbon-item:not(.e-disabled) .e-split-btn-wrapper.e-ribbon-hover,
2067
2210
  .e-ribbon-group-overflow-ddb .e-ribbon-item:not(.e-disabled) .e-split-btn-wrapper.e-ribbon-open {
2068
2211
  border-color: #6c757d;
@@ -2077,7 +2220,8 @@
2077
2220
  }
2078
2221
  .e-ribbon.e-rbn .e-ribbon-item:has(.e-ribbon-gallery-container),
2079
2222
  .e-ribbon-group-overflow-ddb .e-ribbon-item:has(.e-ribbon-gallery-container) {
2080
- border-color: #dee2e6;
2223
+ border-color: #ced4da;
2224
+ background: #fff;
2081
2225
  }
2082
2226
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu),
2083
2227
  .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button,
@@ -2102,8 +2246,8 @@
2102
2246
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button,
2103
2247
  .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),
2104
2248
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-ribbon-group-of-btn {
2105
- color: #212529;
2106
2249
  background: #f8f9fa;
2250
+ color: #212529;
2107
2251
  border-color: transparent;
2108
2252
  }
2109
2253
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu) .e-btn-icon,
@@ -2183,98 +2327,105 @@
2183
2327
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-ribbon-group-of-btn:hover .e-btn-icon {
2184
2328
  color: #fff;
2185
2329
  }
2186
- .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,
2330
+ .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu).e-active,
2187
2331
  .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button.e-active,
2188
- .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:active,
2189
2332
  .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,
2190
- .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,
2191
2333
  .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-group-of-btn.e-active,
2192
- .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-group-of-btn:active,
2193
2334
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu).e-active,
2194
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu):active,
2195
2335
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active,
2196
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:active,
2197
2336
  .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,
2198
- .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,
2199
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-ribbon-group-of-btn.e-active,
2200
- .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,
2337
+ .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,
2201
2338
  .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active,
2202
- .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:active,
2203
2339
  .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,
2204
- .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,
2205
2340
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn.e-active,
2206
- .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn:active,
2207
2341
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn:not(.e-ribbon-file-menu).e-active,
2208
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn:not(.e-ribbon-file-menu):active,
2209
2342
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button.e-active,
2210
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:active,
2211
2343
  .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,
2212
- .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,
2213
2344
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-group-of-btn.e-active,
2214
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-group-of-btn:active,
2215
2345
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu).e-active,
2216
- .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu):active,
2217
2346
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active,
2218
- .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:active,
2219
2347
  .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,
2220
- .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,
2221
2348
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-group-of-btn.e-active,
2222
- .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-group-of-btn:active,
2223
2349
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu).e-active,
2224
- .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu):active,
2225
2350
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active,
2226
- .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:active,
2227
2351
  .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,
2352
+ .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-ribbon-group-of-btn.e-active {
2353
+ background: #6c757d;
2354
+ color: #fff;
2355
+ }
2356
+ .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2357
+ .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2358
+ .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,
2359
+ .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-group-of-btn.e-active .e-btn-icon,
2360
+ .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2361
+ .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2362
+ .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,
2363
+ .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,
2364
+ .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2365
+ .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,
2366
+ .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn.e-active .e-btn-icon,
2367
+ .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2368
+ .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2369
+ .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,
2370
+ .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-group-of-btn.e-active .e-btn-icon,
2371
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2372
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2373
+ .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,
2374
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-group-of-btn.e-active .e-btn-icon,
2375
+ .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2376
+ .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2377
+ .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,
2378
+ .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-ribbon-group-of-btn.e-active .e-btn-icon {
2379
+ color: #fff;
2380
+ }
2381
+ .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu):active,
2382
+ .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:active,
2383
+ .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,
2384
+ .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-group-of-btn:active,
2385
+ .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu):active,
2386
+ .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:active,
2387
+ .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,
2388
+ .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,
2389
+ .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:active,
2390
+ .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,
2391
+ .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn:active,
2392
+ .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn:not(.e-ribbon-file-menu):active,
2393
+ .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:active,
2394
+ .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,
2395
+ .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-group-of-btn:active,
2396
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu):active,
2397
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:active,
2398
+ .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,
2399
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-group-of-btn:active,
2400
+ .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu):active,
2401
+ .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:active,
2228
2402
  .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,
2229
- .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-ribbon-group-of-btn.e-active,
2230
2403
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-ribbon-group-of-btn:active {
2231
2404
  background: #6c757d;
2232
2405
  color: #fff;
2233
2406
  }
2234
- .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,
2235
- .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2407
+ .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu):active .e-btn-icon,
2236
2408
  .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:active .e-btn-icon,
2237
- .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,
2238
2409
  .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,
2239
- .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-group-of-btn.e-active .e-btn-icon,
2240
2410
  .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-group-of-btn:active .e-btn-icon,
2241
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2242
2411
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu):active .e-btn-icon,
2243
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2244
2412
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:active .e-btn-icon,
2245
- .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,
2246
2413
  .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,
2247
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-ribbon-group-of-btn.e-active .e-btn-icon,
2248
- .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,
2249
- .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2414
+ .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,
2250
2415
  .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:active .e-btn-icon,
2251
- .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,
2252
2416
  .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,
2253
- .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn.e-active .e-btn-icon,
2254
2417
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn:active .e-btn-icon,
2255
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2256
2418
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn:not(.e-ribbon-file-menu):active .e-btn-icon,
2257
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2258
2419
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:active .e-btn-icon,
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 .e-btn-icon,
2260
2420
  .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,
2261
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-group-of-btn.e-active .e-btn-icon,
2262
2421
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-group-of-btn:active .e-btn-icon,
2263
- .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2264
2422
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu):active .e-btn-icon,
2265
- .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2266
2423
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:active .e-btn-icon,
2267
- .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,
2268
2424
  .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,
2269
- .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-group-of-btn.e-active .e-btn-icon,
2270
2425
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-group-of-btn:active .e-btn-icon,
2271
- .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2272
2426
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu):active .e-btn-icon,
2273
- .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2274
2427
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:active .e-btn-icon,
2275
- .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,
2276
2428
  .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,
2277
- .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-ribbon-group-of-btn.e-active .e-btn-icon,
2278
2429
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-ribbon-group-of-btn:active .e-btn-icon {
2279
2430
  color: #fff;
2280
2431
  }
@@ -2304,6 +2455,8 @@
2304
2455
  background: #6c757d;
2305
2456
  color: #fff;
2306
2457
  border-color: unset;
2458
+ -webkit-box-shadow: none;
2459
+ box-shadow: none;
2307
2460
  }
2308
2461
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu):focus-visible .e-btn-icon,
2309
2462
  .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:focus-visible .e-btn-icon,
@@ -2466,7 +2619,8 @@
2466
2619
  .e-ribbon-group-overflow-ddb.e-dropdown-popup,
2467
2620
  .e-ribbon-dropdown-group-button.e-dropdown-popup {
2468
2621
  background: #fff;
2469
- box-shadow: unset;
2622
+ -webkit-box-shadow: unset;
2623
+ box-shadow: unset;
2470
2624
  border-color: #ced4da;
2471
2625
  }
2472
2626
  .e-ribbon-file-menu.e-dropdown-popup .e-btn:not(.e-ribbon-file-menu),
@@ -2484,33 +2638,19 @@
2484
2638
  background: transparent;
2485
2639
  }
2486
2640
 
2487
- .e-ribbon-gallery-item {
2641
+ .e-ribbon-gallery-button {
2642
+ border-color: #ced4da;
2488
2643
  background: transparent;
2489
- border-color: transparent;
2490
- }
2491
- .e-ribbon-gallery-item:hover {
2492
- background: #f8f9fa;
2493
- }
2494
- .e-ribbon-gallery-item.e-ribbon-gallery-selected {
2495
- background: #007bff;
2496
- }
2497
- .e-ribbon-gallery-item.e-ribbon-gallery-selected .e-ribbon-gallery-text {
2498
- color: #fff;
2644
+ color: #495057;
2499
2645
  }
2500
- .e-ribbon-gallery-item.e-ribbon-gallery-selected .e-ribbon-gallery-icons {
2646
+ .e-ribbon-gallery-button.e-gallery-button-active {
2647
+ background: #6c757d;
2501
2648
  color: #fff;
2502
2649
  }
2503
- .e-ribbon-gallery-item.e-disabled {
2650
+
2651
+ .e-ribbon-gallery-item {
2504
2652
  background: transparent;
2505
- }
2506
- .e-ribbon-gallery-item.e-disabled .e-ribbon-gallery-text {
2507
- color: #adb5bd;
2508
- }
2509
- .e-ribbon-gallery-item.e-disabled .e-ribbon-gallery-icons {
2510
- color: #adb5bd;
2511
- }
2512
- .e-ribbon-gallery-item:focus, .e-ribbon-gallery-item:focus-visible {
2513
- border-color: #f8f9fa;
2653
+ border-color: transparent;
2514
2654
  }
2515
2655
  .e-ribbon-gallery-item .e-ribbon-gallery-text {
2516
2656
  color: #212529;
@@ -2519,23 +2659,60 @@
2519
2659
  color: #495057;
2520
2660
  }
2521
2661
 
2522
- .e-ribbon-gallery-button {
2523
- border-color: #dee2e6;
2524
- }
2525
- .e-ribbon-gallery-button.e-gallery-button-active {
2526
- background: #007bff;
2527
- }
2528
-
2529
2662
  .e-ribbon-gallery-popup.e-popup,
2530
2663
  .e-dropdown-popup.e-ribbon-gallery-dropdown {
2531
2664
  background: #fff;
2532
- box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
2665
+ -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
2666
+ box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
2533
2667
  }
2534
2668
  .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-header,
2535
2669
  .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-header {
2536
2670
  color: #212529;
2537
2671
  }
2538
2672
 
2673
+ .e-ribbon-gallery-wrapper .e-ribbon-gallery-item:hover,
2674
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item:hover,
2675
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item:hover {
2676
+ background: #f8f9fa;
2677
+ }
2678
+ .e-ribbon-gallery-wrapper .e-ribbon-gallery-item.e-ribbon-gallery-selected,
2679
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item.e-ribbon-gallery-selected,
2680
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item.e-ribbon-gallery-selected {
2681
+ background: #007bff;
2682
+ }
2683
+ .e-ribbon-gallery-wrapper .e-ribbon-gallery-item.e-ribbon-gallery-selected .e-ribbon-gallery-text,
2684
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item.e-ribbon-gallery-selected .e-ribbon-gallery-text,
2685
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item.e-ribbon-gallery-selected .e-ribbon-gallery-text {
2686
+ color: #fff;
2687
+ }
2688
+ .e-ribbon-gallery-wrapper .e-ribbon-gallery-item.e-ribbon-gallery-selected .e-ribbon-gallery-icons,
2689
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item.e-ribbon-gallery-selected .e-ribbon-gallery-icons,
2690
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item.e-ribbon-gallery-selected .e-ribbon-gallery-icons {
2691
+ color: #fff;
2692
+ }
2693
+ .e-ribbon-gallery-wrapper .e-ribbon-gallery-item.e-disabled,
2694
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item.e-disabled,
2695
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item.e-disabled {
2696
+ background: transparent;
2697
+ }
2698
+ .e-ribbon-gallery-wrapper .e-ribbon-gallery-item.e-disabled .e-ribbon-gallery-text,
2699
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item.e-disabled .e-ribbon-gallery-text,
2700
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item.e-disabled .e-ribbon-gallery-text {
2701
+ color: #adb5bd;
2702
+ }
2703
+ .e-ribbon-gallery-wrapper .e-ribbon-gallery-item.e-disabled .e-ribbon-gallery-icons,
2704
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item.e-disabled .e-ribbon-gallery-icons,
2705
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item.e-disabled .e-ribbon-gallery-icons {
2706
+ color: #adb5bd;
2707
+ }
2708
+ .e-ribbon-gallery-wrapper .e-ribbon-gallery-item:focus, .e-ribbon-gallery-wrapper .e-ribbon-gallery-item:focus-visible,
2709
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item:focus,
2710
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item:focus-visible,
2711
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item:focus,
2712
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item:focus-visible {
2713
+ border-color: #f8f9fa;
2714
+ }
2715
+
2539
2716
  .e-dropdown-popup.e-ribbon-dropdown-group-button .e-btn-icon {
2540
2717
  color: #495057;
2541
2718
  }
@@ -2569,6 +2746,12 @@
2569
2746
  .e-dropdown-popup.e-ribbon-dropdown-group-button .e-btn.e-ribbon-group-button.e-active .e-btn-icon {
2570
2747
  color: #fff;
2571
2748
  }
2749
+ .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 {
2750
+ background: #6c757d;
2751
+ }
2752
+ .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 {
2753
+ color: #fff;
2754
+ }
2572
2755
 
2573
2756
  .e-ribbon-tooltip.e-tooltip-wrap.e-popup {
2574
2757
  background: #000;