/*= Windows Control - Move to toolbar ========================================*/
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */

/* Titlebar Button Box */
:root {
  --uc-titlebar-padding: 0px;
}

#navigator-toolbox {
  padding-top: var(--uc-titlebar-padding) !important;

  @include Option("userChrome.tabbar.on_bottom") {
    @include Option("userChrome.tabbar.on_bottom.menubar_on_top") {
      padding-top: calc(max(var(--uc-menubar-height), var(--uc-menubar-height-default)) + var(--uc-titlebar-padding)) !important;
    }
  }
}

#toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container,
#TabsToolbar > .titlebar-buttonbox-container {
  position: fixed;
  display: block;
  top: 0;
  right:0;
  z-index: 1;
}

#toolbar-menubar[autohide="true"] {
  > .titlebar-buttonbox-container {
    height: var(--uc-titlebar-buttonbox-height, var(--uc-navbar-height, 36px));
  }

  @include OS($win10) {
    &[inactive="true"] > .titlebar-buttonbox-container .titlebar-button {
      stroke: var(--toolbar-color, currentColor) !important;
    }
  }
}

.titlebar-buttonbox-container > .titlebar-buttonbox {
  height: 100%;
  @include OS($mac) {
    margin-block: 10px;
  }
}

@include WindowControl_Left {
  .titlebar-buttonbox-container{
    left:0;
    right: unset !important;
  }
}

@include OS($win) {
  :root[sizemode="maximized"]:is([tabsintitlebar], [customtitlebar]) {
    @if mode.isESR() {
      --uc-titlebar-padding: 8px;
    }

    #navigator-toolbox-background {
      margin-top: calc(-1 * var(--uc-titlebar-padding));
    }
  }
  :root[sizemode="normal"]:is([tabsintitlebar], [customtitlebar]) #titlebar,
  :root[sizemode="maximized"]:is([tabsintitlebar], [customtitlebar]) #titlebar {
    appearance: none !important;
  }
  .browser-toolbar:not(.titlebar-color):not(.browser-titlebar) {
    background-clip: border-box !important;
  }
}

@include OS($mac) {
  #toolbar-menubar:not([autohide="true"]) {
    visibility: visible !important;
    height: 0;
  }
}

#toolbar-menubar[inactive] > .titlebar-buttonbox-container {
  @include NotOption("userChrome.hidden.tabbar") {
    opacity: 0;
    visibility: collapse;
  }
  @include Option("userChrome.hidden.tabbar") {
    opacity: 1;
    visibility: visible;

    @include Option("userChrome.autohide.navbar") {
      opacity: 0;
      visibility: collapse;
    }
  }
}

#navigator-toolbox:is(:hover, :focus-within) #toolbar-menubar[inactive]:not([customizing]) > .titlebar-buttonbox-container {
  @include Option("userChrome.hidden.tabbar") {
    @include Option("userChrome.autohide.navbar") {
      opacity: 1;
      visibility: visible;
    }
  }
}

@include Animate {
  #toolbar-menubar[inactive] > .titlebar-buttonbox-container {
    transition: opacity 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay, 600ms),
                visibility 100ms var(--animation-easing-function) 0.25s !important;
  }
  #navigator-toolbox:is(:hover, :focus-within) #toolbar-menubar[inactive]:not([customizing]) > .titlebar-buttonbox-container {
    transition-delay: 0s !important;
  }
}

@include Option("browser.fullscreen.autohide") {
  :root[sizemode="fullscreen"] #navigator-toolbox:not(:hover) .titlebar-buttonbox-container {
    visibility: hidden;
  }
}
@include Option("userChrome.hidden.tabbar") {
  :root[inFullscreen]:not([macOSNativeFullscreen]) {
    #toolbar-menubar {
      visibility: visible !important;
      min-height: 0 !important;
      max-height: 0 !important;
    }
    #menubar-items {
      visibility: collapse !important;
    }
  }

  :root:is([tabsintitlebar], [customtitlebar]) {
    #titlebar,
    #toolbar-menubar,
    #TabsToolbar {
      z-index: 1;
      &:-moz-window-inactive {
        opacity: 1 !important;
        .titlebar-buttonbox {
          opacity: var(--inactive-titlebar-opacity);
        }
      }
    }
  }
}

/* At Activated Menubar */
:root:not([chromehidden~="menubar"], [sizemode="fullscreen"]) #toolbar-menubar:not([autohide="true"]) + #TabsToolbar > .titlebar-buttonbox-container {
  display: block !important;
}
:root:not([chromehidden~="menubar"]) #toolbar-menubar:not([autohide="true"]) .titlebar-buttonbox-container {
  @include NotOption("userChrome.hidden.tabbar") {
    visibility: hidden;
  }
}
