/* ################################################################################################# */
/* AUTO-HIDE SIDE BAR/MOUSE CLICK ON LEFT + NAVBAR UP/TABBAR DOWN: AUTO-HIDE + MOUSE CLICK CORNERS */
/* ################################################################################################# */

@-moz-document url(chrome://browser/content/browser.xul) {
:root[sessionrestored="true"] :-moz-any(#navigator-toolbox,#browser){
    -moz-binding: url("SideBar.xml#ucjs");
}
.statecheck-check[id] {
    border: none !important;
    background-color: transparent !important;
    position:fixed;
    z-index:1;
}
.statecheck-check[checked] { background:rgba(0,0,250,0.2) !important; }
/* nav-bar things */
#statechecker-navigator-toolbox{
  height: calc(2 * var(--toolbarbutton-inner-padding) + 21px);
  width: 100%;
}
#TabsToolbar {
  -moz-box-ordinal-group: 2 !important;
  position:relative;
  z-index:0;
}

#TabsToolbar > .titlebar-placeholder[type="caption-buttons"]{ display:none; }
#titlebar-buttonbox-container{ z-index:5; position:relative; }
#PersonalToolbar { -moz-box-ordinal-group: 3 !important; }
#tabbrowser-tabs{ -moz-window-dragging: no-drag; }
#nav-bar {
  pointer-events: none;
  z-index:1;
  padding-right: 170px !important;
  padding-left: 30px;
  margin-bottom: -32px;
  -moz-window-dragging: no-drag;
  transition: margin-bottom 0.1s ease-in-out !important;
}
#toolbar-menubar:not([inactive]) ~ #nav-bar{ pointer-events:auto; }
#toolbar-menubar{ position:relative; }
#nav-bar > *, #toolbar-menubar{ z-index:3; pointer-events:auto; }
#statechecker-navigator-toolbox[checked] ~ #nav-bar,
#nav-bar:hover,
#TabsToolbar:hover ~ #nav-bar,
.statecheck-check:hover ~ #nav-bar{
    margin-bottom:0px;
    }

/* Fix panel popups causing layout change on click */
panel[type="arrow"][side]{ padding-bottom:8px !important; }
panel[type="arrow"][side]:not([animate="false"]){ transform: translateY(5px) }
panel[type="arrow"][side][animate="open"]{ transform: translateY(8px) }

/* sidebar-things */
:root { --sidebar-hover-width: 10px; --sidebar-visible-width: 200px; }
#statechecker-browser{
  height:100%;
  width:var(--sidebar-hover-width)
}
#statechecker-browser:not([checked]) ~ #sidebar-box {
  position: relative !important;
  overflow-x: hidden !important;
  margin-right: calc(var(--sidebar-hover-width) * -1) !important;
  left: var(--sidebar-hover-width) !important;
  min-width: var(--sidebar-hover-width) !important;
  max-width: var(--sidebar-hover-width) !important;
  opacity: 0 !important;
}

#statechecker-browser:not([checked]):hover ~ #sidebar-box,
#statechecker-browser:not([checked]) ~ #sidebar-box:hover{
  margin-right: calc(var(--sidebar-visible-width) * -1) !important;
  left: var(--sidebar-visible-width) !important;
  min-width: var(--sidebar-visible-width) !important;
  max-width: var(--sidebar-visible-width) !important;
  opacity: 1 !important;
}

#statechecker-browser:not([checked]) ~ #sidebar-box > #sidebar{
  opacity: 1 !important;
}

#statechecker-browser:hover ~ #sidebar-box #sidebar,
#sidebar-box:hover > #sidebar, #sidebar:hover {
  opacity: 1 !important; }
/* #sidebar-header is hidden by default, change "none" to "inherit" to restore it. */
#sidebar-header {
  display: inherit !important;
}

}