/* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
/* TABBAR */
/* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */

/* Same background-color than NavBar */
#titlebar { background: var(--toolbar-bgcolor) !important }

/* Make border-bottom transparent */
#navigator-toolbox { border-bottom-color: transparent !important }

/* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
/* TABS ON BOTTOM */
/* CREDITS: https://github.com/MrOtherGuy/firefox-csshacks/blob/master/chrome/Fx65_tabs_on_bottom.css */

:root { --uc-titlebar-padding: 0 }
:root[sizemode="maximized"][tabsintitlebar] { --uc-titlebar-padding: 8px }

.titlebar-buttonbox-container {
position: fixed;
display: block;
top: var(--uc-titlebar-padding,0);
right: 0;
height: 40px }

:root[uidensity="compact"] .titlebar-buttonbox-container { height: 32px }

#toolbar-menubar[inactive] > .titlebar-buttonbox-container { opacity: 0 }

#navigator-toolbox { padding-top: var(--uc-titlebar-padding,0) !important }

.titlebar-buttonbox-container > .titlebar-buttonbox { height: 100% }

#titlebar {
-moz-box-ordinal-group: 2;
-moz-appearance: none !important }

.titlebar-placeholder,
#TabsToolbar .titlebar-spacer { display: none }
/* Also hide the toolbox bottom border which isn't at bottom with this setup */
#navigator-toolbox::after { display: none !important }

@media (-moz-gtk-csd-close-button) { .titlebar-button { -moz-box-orient: vertical } }

/* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
/* MULTI-ROW TABS */
/* CREDITS: https://github.com/MrOtherGuy/firefox-csshacks/blob/master/chrome/multi-row_tabs.css
Makes tabs to appear on multiple lines.
Tab reordering will not work and can't be made to work.
It's recommended to move tabs new-tab-button outside tabs toolbar. */

/* Change the --multirow-n-rows to change maximum number of rows before the rows will start to scroll */
:root {
--multirow-n-rows: 3;
--multirow-tab-min-width: 100px;
--multirow-tab-dynamic-width: 1 /* Change to 0 for fixed-width tabs using the above width. */ }

/* Scrollbar can't be clicked but the rows can be scrolled with mouse wheel.
Uncomment the next line if you want to be able to use the scrollbar with mouse clicks */
/* .tabbrowser-arrowscrollbox{ -moz-window-dragging: no-drag } */

/* Uncommenting the above makes you unable to drag the window from empty space in the tab strip but normal draggable spaces will continue to work */
#tabbrowser-tabs {
min-height: unset !important;
padding-inline-start: 0 !important }

/* Selectors for Firefox 71+ */
/* These are not tabs toolbar specific but horizontal scrollbox isn't used elsewhere, except in bookmarks toolbar but there it doesn't have [part] attribute since it's not in shadow-root */
@-moz-document url(chrome://browser/content/browser.xhtml) {
.scrollbutton-up[orient="horizontal"][part]~spacer,
.scrollbutton-up[orient="horizontal"][part],
.scrollbutton-down[orient="horizontal"][part] { display: none }

scrollbox[part][orient="horizontal"] {
display: flex;
flex-wrap: wrap;
overflow-y: auto;
max-height: calc(var(--tab-min-height) * var(--multirow-n-rows));
scrollbar-color: currentColor transparent;
scrollbar-width: thin } }

/* Test for Firefox > 66 */
@supports (inset-block:auto) {
#tabbrowser-tabs > .tabbrowser-arrowscrollbox > .arrowscrollbox-scrollbox {
display: flex;
flex-wrap: wrap;
overflow-y: auto;
max-height: calc(var(--tab-min-height) * var(--multirow-n-rows));
scrollbar-color: var(--toolbar-bgcolor) var(--lwt-accent-color);
scrollbar-width: thin }
#tabbrowser-tabs > .tabbrowser-arrowscrollbox {
overflow: -moz-hidden-unscrollable;
display: block } }

.tabbrowser-tab { height: var(--tab-min-height) }
#tabbrowser-tabs .tabbrowser-tab[pinned] {
position: static !important;
margin-inline-start: 0 !important }

.tabbrowser-tab[fadein]:not([pinned]) {
min-width: var(--multirow-tab-min-width) !important;
flex-grow: var(--multirow-tab-dynamic-width);
/* Uncomment to enable full-width tabs, also makes tab dragging a tiny bit more sensible.
Don't set to none or you'll see errors in console when closing tabs. */
/*max-width: 100vw !important;*/ }

.tabbrowser-tab > stack {
width: 100%;
height: 100% }

#tabbrowser-tabs .scrollbutton-up,
#tabbrowser-tabs .scrollbutton-down,
#alltabs-button,
:root:not([customizing]) #TabsToolbar #new-tab-button,
#tabbrowser-tabs spacer,
.tabbrowser-tab::after { display: none !important }