/* Modify this to change window drag space width */

:root{
  --uc-window-control-width: 138px;
}

#navigator-toolbox{ --window-drag-space-width: 24px }

.titlebar-buttonbox-container{
  position: fixed;
  top:0;
  right:0;
  height: 40px;
  z-index: 3;
  visibility: visible !important;
  display: -moz-box !important;
}

:root[inFullscreen] > #navigator-toolbox:not(:hover) .titlebar-buttonbox-container{ display: none !important; }

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

/* Re-adjust window cotrols if menubar is permanently enabled  */
:root[tabsintitlebar="true"]:not([inFullscreen]) #toolbar-menubar[autohide="false"]{ transform: translateX(0px); }
:root[tabsintitlebar="true"]:not([inFullscreen]) #toolbar-menubar[autohide="false"] .titlebar-buttonbox-container{ height: 100%; }
:root[tabsintitlebar="true"]:not([inFullscreen]) #toolbar-menubar[autohide="false"] .titlebar-button{ padding: 2px 17px !important; }

#titlebar{ -moz-appearance: none !important; }
/* Counteract -moz-appearance when maximized */
:root[sizemode="maximized"] > #navigator-toolbox{ padding-top: 8px !important; }
:root[sizemode="maximized"] #toolbar-menubar:not([autohide="false"]) .titlebar-buttonbox-container{ top: 8px }

/* Space to drag the window on both sides of navbar */
:root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar{
  padding-right: calc(var(--uc-window-control-width) + var(--window-drag-space-width,0px));
  padding-left: var(--window-drag-space-width,0px)
}

/* Move tabs below content */
:root:not([inDOMFullscreen]) #content-deck{ margin-bottom: var(--tab-min-height) }
#TabsToolbar{ position: fixed; bottom: 0px; width: 100vw; }

/* Hide stuff that doesn't make sense with tabs below content */
#TabsToolbar > .titlebar-buttonbox-container,
#window-controls, /* Fullscreen window controls */
#TabsToolbar .titlebar-spacer{
  display: none !important;
}