/* @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); */

@-moz-document url(chrome://browser/content/browser.xul),
               url(chrome://browser/content/browser.xhtml)
{
  /*** TREE STYLE TABS ***/
  /* Hide main tabs toolbar */
  #TabsToolbar {
  	visibility: collapse !important;
  }
  /* Sidebar min and max width removal */
  #sidebar {
  	max-width: none !important;
  	min-width: 0px !important;
  }
  /* hide sidebar header */
  #sidebar-header {
	display: none;
  }
  /* Hide splitter, when using Tree Style Tab. */
  #sidebar-box[sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"] + #sidebar-splitter {
  	display: none !important;
  }
  /* Hide sidebar header, when using Tree Style Tab. */
  #sidebar-box[sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"] #sidebar-header {
  	visibility: collapse;
  }
  
  /* Shrink sidebar until hovered, when using Tree Style Tab. */
  :root {
  	--thin-tab-width: 30px;
  	--wide-tab-width: 200px;
  }
  #sidebar-box {
  	min-width: var(--thin-tab-width) !important;
  	max-width: none !important;
  }
  /* #sidebar-box {
  	position: relative !important;
  	transition: all 300ms !important;
  	min-width: var(--thin-tab-width) !important;
  	max-width: var(--thin-tab-width) !important;
  } */
  #sidebar-box:hover {
  	transition: all 300ms !important;
  	min-width: var(--wide-tab-width) !important;
  	max-width: var(--wide-tab-width) !important;
  
  	/* Negative right-margin to keep page from being pushed to the side. */
  	margin-right: calc((var(--wide-tab-width) - var(--thin-tab-width)) * -1) !important;
  }

  /*** TAB BAR ***/
  /* Ensure tab doesn't show through auto-completion popup */
  .tabbrowser-tab { z-index: 0 !important; }
  /* Ensure tab "spacers" don't show through the completion window */
  #tabbrowser-arrowscrollbox > spacer { z-index: -1 !important; }
  #mainPopupSet { z-index: 9999 !important; }

  /* Hide tabbar if only one tab */
  @import url(./css/tabs-hide-if-only-one.css);


  /* Remove the colored overline on the focused tab */
  .tabbrowser-tab .tab-line { background: none !important; }

  /* Replace favicon on tabs with close button on mouse hover */
  .tabbrowser-tab:not(:hover) .tab-close-button,
  .tabbrowser-tab:not([pinned]):hover .tab-icon-image { display: none !important; }
  .tabbrowser-tab:not([pinned]):hover .tab-close-button { display:block !important; }

  .tabbrowser-tab:hover .tab-throbber,
  .tabbrowser-tab:hover .tab-icon-image,
  .tabbrowser-tab:hover .tab-sharing-icon-overlay,
  .tabbrowser-tab:hover .tab-icon-overlay,
  .tabbrowser-tab:hover .tab-label-container,
  .tabbrowser-tab:hover .tab-icon-sound {
    -moz-box-ordinal-group: 2 !important;
  }

  .tabbrowser-tab .tab-close-button {
    margin-left: -2px !important;
    margin-right: 4px !important;
  }

  .tab-close-button:hover {
    fill-opacity: 0 !important;
  }

  .tabbrowser-tab::after,
  .tabbrowser-tab::before {
    border-left: none !important;
    border-right: none !important;
  }

  .scrollbutton-up[orient="horizontal"]~spacer { border-width: 0px; opacity: 0 }


  /*** NAV BAR ***/
  /* Hide urlbar */
  #nav-bar {
    position: relative !important;
    z-index: 2 !important;
    height: 2px !important;
    min-height: 2px !important;
    margin-bottom: -2px !important;
    opacity: 0 !important;
    border: none !important;
  }

  /* But unfocus it when we invoke it with ctrl+L */
  #nav-bar:focus-within {
    height: auto !important;
    margin-bottom: 0px !important;
    opacity: 1 !important;
    overflow: show !important;
  }

  #urlbar-container {
    min-height: 0 !important;
  }

  #urlbar {
    top: 0 !important;
  }

  #urlbar-input-container {
    height: 28px !important;
  }

  /*** Load local overrides ***/
  @import url(./userChrome.local.css);
}