/* 
 * 2023/05/10: Updated for Firefox v113.0; replaced almost all the code with aris-t2's again from here: https://github.com/Aris-t2/CustomCSSforFx/blob/master/current/css/tabs/tabs_below_navigation_toolbar.css
               Some minor customisations at the end to give a hover effect for the tabs, put lines/shadows around each tab to make them stand out, & make sure selected tab is clearly visible. 
 * 2021/06/02: Updated for Firefox v89.0; added yochaym's code from this github issue: https://github.com/Aris-t2/CustomCSSforFx/issues/344
 * 2020/01/08: Updated for Firefox v72.0.
 * 2019/12/04: Updated for Firefox v71.0.
 * 
 * The following settings are simply glued together from the various files that make up the "tabs below navigation" from the 
 * most excellent Custom CSS tweaks for Firefox Quantum: https://github.com/Aris-t2/CustomCSSforFx .
 * This may include other settings that change other display elements; I have not gone through it closely. 
 * 
 * 
 * All credit to Aris-t2 & the other contributors!
*/

:root {
  --tabs_toolbar_color_tabs_not_on_top: linear-gradient(#f9f9fa,#f9f9fa);
  --tab-min-height_tnot: 32px;
  --tab_below_navigation_toolbar_bottom_padding: calc( var(--tab-min-height_tnot) + 5px );
}

#TabsToolbar {
  position: absolute;
  display: block;
  bottom: 0;
  width: 100vw;
  background-clip: padding-box;
  color: var(--toolbar-color);
  z-index: 2;
}

/* overrides other settings too */
#main-window:not(:-moz-lwtheme) #navigator-toolbox #TabsToolbar:not(:-moz-lwtheme){
  appearance: none;
  background-image: var(--tabs_toolbar_color_tabs_not_on_top) !important;
}

#main-window:not([tabsintitlebar]) #TabsToolbar:not(:-moz-lwtheme){
  appearance: none !important;
}

#tabbrowser-tabs {
  width: 100%;
}

#navigator-toolbox {
  position: relative;
  padding-bottom: var(--tab_below_navigation_toolbar_bottom_padding);
}

#main-window[tabsintitlebar]:not([inDOMFullscreen="true"]) #titlebar,
#main-window[tabsintitlebar][sizemode="maximized"]:not([inDOMFullscreen="true"]) #titlebar {
  height: 26px;
}

/* prevent possible item overlapping with caption buttons */
#main-window[tabsintitlebar] #toolbar-menubar {
  padding-inline-end: 140px;
}

/* move caption buttons to windows top right position */
.titlebar-buttonbox-container {
  position: fixed;
  right: 0;
  visibility: visible;
  display: block;
}

#TabsToolbar .titlebar-buttonbox-container,
#TabsToolbar .private-browsing-indicator,
#TabsToolbar #window-controls,
#TabsToolbar *[type="caption-buttons"],
#TabsToolbar *[type="pre-tabs"],
#TabsToolbar *[type="post-tabs"] {
  display: none;
}

/* lw themes support */
#nav-bar {
  box-shadow: unset !important;
}

/* remove color overlay for lw-themes */
#main-window[style*='--lwt-header-image'] :is(#nav-bar,#PersonalToolbar,#TabsToolbar):-moz-lwtheme{
  background: unset !important;
}

/* adjust background color */
#main-window:not([style*='--lwt-header-image']) #TabsToolbar:-moz-lwtheme {
  appearance: none !important;
  background-image: linear-gradient(var(--toolbar-bgcolor),var(--toolbar-bgcolor)) !important;
}

/* Fixes for projects other settings */
/* remove application/hamburger button in titlebar and tab toolbars start padding */
#main-window[tabsintitlebar][sizemode="fullscreen"] #navigator-toolbox #PanelUI-button {
  visibility: collapse;
}

/* override code inside appbutton in titlebar code */
#main-window[tabsintitlebar] #toolbar-menubar[autohide="true"][inactive="true"] ~ #TabsToolbar,
#main-window[tabsintitlebar][sizemode="maximized"] #toolbar-menubar[autohide="true"][inactive="true"] ~ #TabsToolbar,
#main-window[tabsintitlebar][sizemode="fullscreen"] #TabsToolbar,
#main-window[uidensity=compact][tabsintitlebar] #toolbar-menubar[autohide="true"][inactive="true"] ~ #TabsToolbar,
#main-window[uidensity=compact][tabsintitlebar][sizemode="maximized"] #toolbar-menubar[autohide="true"][inactive="true"] ~ #TabsToolbar,
#main-window[tabsintitlebar]:is([sizemode="normal"],[sizemode="maximized"],[sizemode="fullscreen"]) #navigator-toolbox #TabsToolbar {
  padding-inline-start: 0px !important;
  margin-inline-start: 0px !important;
}

/* remove restored border between navigation toolbar and tabs toolbar */
#nav-bar:not(:-moz-lwtheme) {
  box-shadow: unset !important;
}

/* notification position */
#tab-notification-deck {
  position: absolute;
  display: block;
  bottom: calc( -2 * var(--tab_below_navigation_toolbar_bottom_padding) + 8px );
  width: 100vw;
}
/*
#TabsToolbar #tabbrowser-arrowscrollbox {
  margin-top: 1px !important;
  margin-bottom: -1px !important;
}
*/

/* Fx 105+ */
:root:not([privatebrowsingmode=temporary]) :is(toolbarbutton, toolbarpaletteitem) + #tabbrowser-tabs,
:root[privatebrowsingmode=temporary] :is(toolbarbutton:not(#firefox-view-button), toolbarpaletteitem:not(#wrapper-firefox-view-button)) + #tabbrowser-tabs {
  border-inline-start: 0px solid color-mix(in srgb, currentColor 25%, transparent) !important;
}

:root:not([privatebrowsingmode=temporary]):not([firefoxviewhidden]) :is(#firefox-view-button, #wrapper-firefox-view-button) + #tabbrowser-tabs:not([overflow="true"]) {
  padding-inline-start: 0 !important;
  margin-inline-start: 0 !important;
}

/* Fx 106+ */					
#private-browsing-indicator-with-label {
  display: none !important;
}


/** trog-specific changes **/

/* Selected tabs I want a bright background with a dark foreground */
.tabbrowser-tab[selected] .tab-background {
  background: #ccffcc !important;
}
.tabbrowser-tab[selected] .tab-label {
  color: black !important;
  font-weight: bold !important;
}

/* Hover over tabs */
.tabbrowser-tab:hover .tab-background:not([selected]) {
  background: #cccccc !important;
}


/* Top Margin */
.tab-background, .tab-content {
  margin-top: 0 !important;
  /* trog */
  margin-block: 0 !important; /* leaving this in */
  border-radius: 8px 8px 0 0 !important;
  box-shadow: 0 0 1px 1px rgba(0,0,0,0.1) !important;
  border: 1px solid rgba(111,111,111,.3) !important;

}