/* Photonic - Windows 7 transparent tabs
 * 
 * This style replaces the background (not selected) tabs with glass
 * and fog, similar to the "Australis" (and Australium) theme. It does
 * not change the tab shape or any other styling, and is designed to
 * make the tabs behave like they do on other platforms (e.g. Windows 10).
 *
 * To install this, you can either place the contents of this style
 * into userChrome.css, or use the "Stylem" extension to create a
 * userstyle and paste this style into it, giving it a name and clicking
 * "save" to save it.
 */

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

@media (-moz-os-version: windows-win7) {
  @media (-moz-windows-glass) {
    /* Glass Fog */
    #TabsToolbar[tabsontop=true]:not(:-moz-lwtheme) {
      background-image: none;
      position: relative;
    }

    #TabsToolbar[tabsontop=true]:not(:-moz-lwtheme)::before {
      box-shadow: 0 0 30px 30px rgb(174,189,204);
      content: "";
      display: -moz-box;
      height: 0;
      margin: 0 60px;
      opacity: 0.85;
      position: absolute;
      pointer-events: none;
      top: 50%;
      width: -moz-available;
      z-index: -1;
    }

    #main-window[sizemode=normal] #tabbrowser-tabs[tabsontop=true] > .tabbrowser-arrowscrollbox > .arrowscrollbox-scrollbox > .scrollbox-innerbox:not(:-moz-lwtheme) {
      position: relative;
    }

    #appmenu-button-container,
    #main-window:after  {
      z-index: 1 !important;
    }
    /* End Glass Fog */
  }

  @media (-moz-windows-default-theme) {
    #navigator-toolbox {
      --tabs-border-color: rgba(0,0,0,.3) !important;
    }
    
    :root:not(:-moz-lwtheme) {
      --titlebar-text-color: currentColor !important;
    }

    #TabsToolbar[tabsontop=true] .tabbrowser-tab:not([selected=true]):not(:-moz-lwtheme) {
      background-color: transparent !important;
      background-clip: padding-box !important;
    }
    
    /* Tab separators */

    .tabbrowser-tab::after,
    .tabbrowser-tab::before {
      border-left: 1px solid currentColor !important;
      margin-top: 5px !important;
      margin-bottom: 4px !important;
      opacity: 0.3 !important;
    }

    .tabbrowser-tab::before {
      margin-inline-start: -1px !important;
    }

    :root[tabsintitlebar]:not([extradragspace]) #toolbar-menubar[autohide=true] + #TabsToolbar > #tabbrowser-tabs > .tabbrowser-tab::after,
    /* Show full height tab separators on hover and multiselection. */
    .tabbrowser-tab:hover::after,
    #tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab[beforehovered]::after {
      margin-top: var(--tabs-top-border-width) !important;
      margin-bottom: 0 !important;
    }

    #tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab[beforeselected]::after,
    #tabbrowser-tabs[movingtab] > .tabbrowser-tab[selected]::before,
    .tabbrowser-tab[selected]::after {
      border-color: var(--tabs-border-color) !important;
      margin-top: 0 !important;
      margin-bottom: 1px !important;
      opacity: 1 !important;
    }
    
    .tabbrowser-tab[selected] .tab-background {
      border-inline-end: none !important;
    }

    .tabbrowser-tab::after,
    #tabbrowser-tabs[movingtab] > .tabbrowser-tab[selected]::before {
      content: "" !important;
      display: -moz-box !important;
    }
  }
}