Remove xul-box use from bunch of styles

chrome/autohide_menubar.css

@@ -17,7 +17,7 @@ See the above repository for updates as well as full license text. */
 #toolbar-menubar > spacer,
 #toolbar-menubar > .titlebar-buttonbox-container{ order: 1000 }
 
-#TabsToolbar > .titlebar-spacer{ display: -moz-box !important; }
+#TabsToolbar > .titlebar-spacer{ display: flex !important; }
 
 :where(#toolbar-menubar){ -moz-window-dragging: no-drag; }
 

chrome/combined_favicon_and_tab_close_button.css

@@ -16,7 +16,7 @@ See the above repository for updates as well as full license text. */
 .tab-close-button{
   -moz-box-ordinal-group: 0; /* Firefox <112 compatibility */
   order: -1;
-  display: -moz-box !important;
+  display: flex !important;
   position: relative;
   margin-inline: -4px -20px !important;
   padding-inline-start: 7px !important;

chrome/combined_tabs_and_main_toolbars.css

@@ -69,6 +69,6 @@ See the above repository for updates as well as full license text. */
 
 /* Set this pref if you want unpinned tabs to become hidden unless selected */
 @supports -moz-bool-pref("userchrome.hide-unpinned-tabs.enabled"){
-  #alltabs-button{ display: -moz-box !important }
+  #alltabs-button{ display: flex !important }
   .tabbrowser-tab:not([pinned]):not([selected]){ visibility: collapse }
 }

chrome/compact_proton.css

@@ -13,7 +13,7 @@ See the above repository for updates as well as full license text. */
   --inline-tab-padding: 8px !important; /* 8px is default value since it looks good - lower values compactify tabs horizontally */
 }
 .subviewbutton.bookmark-item{ padding-block: 4px !important; }
-.subview-subheader{ display: -moz-box }
+.subview-subheader{ display: block }
 menupopup > menuitem,
 menupopup > menu{ padding-block: 0.3em !important; }
 
@@ -35,7 +35,7 @@ menupopup > menu{ padding-block: 0.3em !important; }
 
 /* OPTIONAL - show audio label in compact mode and make the audio icon behavior match non-compact mode */
 /*
-.tab-secondary-label:is([soundplaying], [muted], [activemedia-blocked], [pictureinpicture]){ display: -moz-box !important; margin-bottom: 1px }
+.tab-secondary-label:is([soundplaying], [muted], [activemedia-blocked], [pictureinpicture]){ display: flex !important; margin-bottom: 1px }
 #TabsToolbar:not(:hover) .tab-icon-image{ opacity: 1 !important; }
 #TabsToolbar:not(:hover) .tab-icon-overlay:not([pinned]){ opacity: 0 !important; }
 */

chrome/curved_tabs.css

@@ -136,7 +136,7 @@ See the above repository for updates as well as full license text. */
   }
   .tab-background[selected]::before{
     content: "";
-    display: -moz-box;
+    display: flex;
     height: 2px;
     background: var(--uc-tab-line-color) !important;
   }

chrome/hide_tabs_toolbar_w_alltabs_button.css

@@ -6,7 +6,10 @@ See the above repository for updates as well as full license text. */
 /* Load window_control_placeholder_support.css before this stylesheet */
 
 #tabbrowser-tabs{ visibility: hidden }
-#TabsToolbar-customization-target{ -moz-box-pack: end; }
+#TabsToolbar-customization-target{
+  -moz-box-pack: end;
+  justify-content: flex-end;
+}
 #alltabs-button{
   position: relative;
   z-index: 1;

chrome/integrated_searchbar_popup.css

@@ -39,7 +39,7 @@ slot{
   height: 8px;
   background: var(--toolbar-field-focus-background-color);
   border-inline: 2px solid var(--toolbar-field-focus-border-color);
-  display: -moz-box;
+  display: flex;
   content: "";
   position: relative;
   z-index: 2;

chrome/pinned_tabs_on_right.css

@@ -7,20 +7,34 @@ See the above repository for updates as well as full license text. */
 .scrollbutton-up[orient="horizontal"]~spacer{ display: none }
 
 .scrollbutton-up[orient="horizontal"]~scrollbox{
-  -moz-box-direction: inherit;
+  -moz-box-direction: inherit; /* Fx < 112 compatibility */
-  -moz-box-pack: end;
+  -moz-box-pack: end; /* Fx < 112 compatibility */
+  justify-content: flex-end;
 }
 
 .scrollbutton-up[orient="horizontal"]~scrollbox::after{
-  display: -moz-box;
+  display: -moz-box; /* Fx < 112 compatibility */
   content: "";
-  -moz-box-flex: 1;
+  display: flex;
-  -moz-box-ordinal-group: 2;
+  flex-grow: 1;
+  flex-shrink: 1;
+  order: 2;
+  -moz-box-flex: 1; /* Fx < 112 compatibility */
+  -moz-box-ordinal-group: 2; /* Fx < 112 compatibility */
 }
 
-#tabs-newtab-button{ -moz-box-ordinal-group: 2 }
+#tabs-newtab-button{
-.tabbrowser-tab[pinned]{ -moz-box-ordinal-group: 3 }
+  -moz-box-ordinal-group: 2; /* Fx < 112 compatibility */
+  order: 2;
+}
+.tabbrowser-tab[pinned]{
+  -moz-box-ordinal-group: 3; /* Fx < 112 compatibility */
+  order: 3;
+}
 
 #tabbrowser-tabs[positionpinnedtabs]{ direction: rtl }
-#tabbrowser-tabs[positionpinnedtabs] > arrowscrollbox { -moz-box-direction: reverse }
+#tabbrowser-tabs[positionpinnedtabs] > arrowscrollbox { 
+  -moz-box-direction: reverse; /* Fx < 112 compatibility */
+  flex-direction: row-reverse;
+}
 .tab-content{ direction: ltr }

chrome/selected_tab_as_urlbar.css

@@ -61,7 +61,7 @@ See the above repository for updates as well as full license text. */
   #TabsToolbar > .toolbar-items{ margin-left: 80px }
   :root[sizemode="normal"] #nav-bar-customization-target{ margin-left: 40px }
   #back-button, #forward-button{
-    -moz-box-ordinal-group: 0;
+    -moz-box-ordinal-group: 0; /* Fx <112 compatibility */
     order: -1;
     visibility: visible !important;
     z-index: 2;

chrome/shrinking_pinned_tabs.css

@@ -15,7 +15,8 @@ See the above repository for updates as well as full license text. */
 
 #tabbrowser-arrowscrollbox:not([overflowing]) .tab-content[pinned] {
   padding: 0px !important;
-  -moz-box-pack: center;
+  -moz-box-pack: center; /* Fx <112 compatibility */
+  justify-content: center;
 }
 
 .tab-label-container[pinned] {