@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
@-moz-document url(chrome://browser/content/browser.xul) {
 @media (-moz-windows-compositor) {
  @media not all and (-moz-os-version: windows-vista) {
   @media not all and (-moz-os-version: windows-win7) {
    @media not all and (-moz-os-version: windows-win8) {
    .titlebar-button {
    padding: 6px 10px !important;
    }

    #main-window[sizemode=maximized] .titlebar-button {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
    }
   }
  }
 }
}
}

@media (-moz-windows-compositor) {
  #main-window {
    -moz-appearance: -moz-win-glass;
  }


  /* On win10, if we don't set this on the entire browser container including
   * the sidebar, if the sidebar is open the accent color bleeds through in
   * the titlebar */
  #browser {
    -moz-appearance: -moz-win-exclude-glass;
  }

  @media not all and (-moz-os-version: windows-vista) {
    @media not all and (-moz-os-version: windows-win7) {
      @media not all and (-moz-os-version: windows-win8) {
        @media (-moz-windows-default-theme) {
          #main-window {
            background-color: hsl(0, 0%, 78%);
          }
        }

        #titlebar-buttonbox,
        .titlebar-button {
          -moz-appearance: none !important;
        }

        .titlebar-button {
          border: none;
          margin: 0 !important;
          padding: 10px 17px;
        }

        #main-window[sizemode=maximized] .titlebar-button {
          padding-top: 8px;
          padding-bottom: 8px;
        }

        .titlebar-button > .toolbarbutton-icon {
          width: 12px;
          height: 12px;
        }

        #titlebar-min {
          list-style-image: url(chrome://browser/skin/caption-buttons.svg#minimize);
        }

        #titlebar-max {
          list-style-image: url(chrome://browser/skin/caption-buttons.svg#maximize);
        }

        #main-window[sizemode="maximized"] #titlebar-max {
          list-style-image: url(chrome://browser/skin/caption-buttons.svg#restore);
        }

        #titlebar-close {
          list-style-image: url(chrome://browser/skin/caption-buttons.svg#close);
        }
        #titlebar-close:hover {
          list-style-image: url(chrome://browser/skin/caption-buttons.svg#close-white);
        }


        #titlebar-min:-moz-lwtheme {
          list-style-image: url(chrome://browser/skin/caption-buttons.svg#minimize-themes);
        }
        #titlebar-max:-moz-lwtheme {
          list-style-image: url(chrome://browser/skin/caption-buttons.svg#maximize-themes);
        }
        #main-window[sizemode="maximized"] #titlebar-max:-moz-lwtheme {
          list-style-image: url(chrome://browser/skin/caption-buttons.svg#restore-themes);
        }
        #titlebar-close:-moz-lwtheme {
          list-style-image: url(chrome://browser/skin/caption-buttons.svg#close-themes);
        }


        /* the 12px image renders a 10px icon, and the 10px upscaled gets rounded to 12.5, which
         * rounds up to 13px, which makes the icon one pixel too big on 1.25dppx. Fix: */
        @media (min-resolution: 1.20dppx) and (max-resolution: 1.45dppx) {
          .titlebar-button > .toolbarbutton-icon {
            width: 11.5px;
            height: 11.5px;
          }
        }

        /* 175% dpi should result in the same device pixel sizes as 150% dpi. */
        @media (min-resolution: 1.70dppx) and (max-resolution: 1.95dppx) {
          .titlebar-button {
            padding-left: 14.1px;
            padding-right: 14.1px;
          }

          .titlebar-button > .toolbarbutton-icon {
            width: 10.8px;
            height: 10.8px;
          }
        }

        /* 225% dpi should result in the same device pixel sizes as 200% dpi. */
        @media (min-resolution: 2.20dppx) and (max-resolution: 2.45dppx) {
          .titlebar-button {
            padding-left: 15.3333px;
            padding-right: 15.3333px;
          }

          .titlebar-button > .toolbarbutton-icon {
            width: 10.8px;
            height: 10.8px;
          }
        }

        /* 275% dpi should result in the same device pixel sizes as 250% dpi. */
        @media (min-resolution: 2.70dppx) and (max-resolution: 2.95dppx) {
          /* NB: todo: this should also change padding on the buttons
           * themselves, but without a device to test this on, it's
           * impossible to know by how much. */
          .titlebar-button > .toolbarbutton-icon {
            width: 10.8px;
            height: 10.8px;
          }
        }

        @media (-moz-windows-default-theme) {
          .titlebar-button:hover {
            background-color: hsla(0, 0%, 0%, .12);
          }

          .titlebar-button:hover:active {
            background-color: hsla(0, 0%, 0%, .22);
          }

          .titlebar-button:not(:hover) > .toolbarbutton-icon:-moz-window-inactive {
            opacity: 0.5;
          }

          #titlebar-close:hover {
            background-color: hsl(355, 86%, 49%);
          }

          #titlebar-close:hover:active {
            background-color: hsl(355, 82%, 69%);
          }
        }
        @media not all and (-moz-windows-default-theme) {
          .titlebar-button {
            background-color: -moz-field;
          }
          .titlebar-button:hover {
            background-color: Highlight;
          }

          #titlebar-min {
            list-style-image: url(chrome://browser/skin/caption-buttons.svg#minimize-highcontrast);
          }
          #titlebar-min:hover {
            list-style-image: url(chrome://browser/skin/caption-buttons.svg#minimize-highcontrast-hover);
          }

          #titlebar-max {
            list-style-image: url(chrome://browser/skin/caption-buttons.svg#maximize-highcontrast);
          }
          #titlebar-max:hover {
            list-style-image: url(chrome://browser/skin/caption-buttons.svg#maximize-highcontrast-hover);
          }

          #main-window[sizemode="maximized"] #titlebar-max {
            list-style-image: url(chrome://browser/skin/caption-buttons.svg#restore-highcontrast);
          }
          #main-window[sizemode="maximized"] #titlebar-max:hover {
            list-style-image: url(chrome://browser/skin/caption-buttons.svg#restore-highcontrast-hover);
          }

          #titlebar-close {
            list-style-image: url(chrome://browser/skin/caption-buttons.svg#close-highcontrast);
          }
          #titlebar-close:hover {
            list-style-image: url(chrome://browser/skin/caption-buttons.svg#close-highcontrast-hover);
          }
        }
      }
    }
  }