/* This Source Code Form is subject to the terms of the Mozilla Public
 * License, v. 2.0. If a copy of the MPL was not distributed with this
 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */

@import url("chrome://global/skin/");

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

%include ../shared/browser.inc
%filter substitution
%define toolbarHighlight rgba(255,255,255,.5)
%define selectedTabHighlight rgba(255,255,255,.7)
%define toolbarShadowColor rgba(10%,10%,10%,.4)
%define toolbarShadowOnTab linear-gradient(to top, rgba(10%,10%,10%,.4) 1px, transparent 1px)
%define bgTabTexture linear-gradient(transparent, hsla(0,0%,45%,.1) 1px, hsla(0,0%,32%,.2) 80%, hsla(0,0%,0%,.2))
%define bgTabTextureHover linear-gradient(hsla(0,0%,100%,.3) 1px, hsla(0,0%,75%,.2) 80%, hsla(0,0%,60%,.2))
%define navbarTextboxCustomBorder border-color: rgba(0,0,0,.32);
%define navbarLargeIcons #navigator-toolbox[iconsize=large][mode=icons] > #nav-bar
%define forwardTransitionLength 150ms
%define conditionalForwardWithUrlbar window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] > :-moz-any(#nav-bar[currentset*="unified-back-forward-button"],#nav-bar:not([currentset])) > #unified-back-forward-button
%define conditionalForwardWithUrlbar2 window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] > :-moz-any(#nav-bar[currentset*="unified-back-forward-button"]:not([currentset*="unified-back-forward-button,urlbar-container"]),#nav-bar:not([currentset])) > #unified-back-forward-button
%define conditionalForwardWithUrlbarWidth 27

%ifdef MOZ_OFFICIAL_BRANDING
%define appMenuButtonBorderColor rgba(255,255,255,.5) rgba(6,42,83,.9)
%else
%if MOZ_UPDATE_CHANNEL == aurora
%define appMenuButtonBorderColor hsla(0,0%,100%,.5) hsla(214,89%,21%,.9)
%else
%define appMenuButtonBorderColor hsla(0,0%,100%,.5) hsla(210,59%,13%,.9)
%endif
%endif

#menubar-items {
  -moz-box-orient: vertical; /* for flex hack */
}

#main-menubar {
  -moz-box-flex: 1; /* make menu items expand to fill toolbar height */
}

#navigator-toolbox {
  -moz-appearance: none;
  background-color: transparent;
  border-top: none;
}

#navigator-toolbox::after {
  content: "";
  display: -moz-box;
  -moz-box-ordinal-group: 101; /* tabs toolbar is 100 */
  height: 1px;
  background-color: ThreeDShadow;
}
#navigator-toolbox[tabsontop=false]::after,
#main-window[disablechrome] #navigator-toolbox::after {
  visibility: collapse;
}

#navigator-toolbox > toolbar:not(:-moz-lwtheme) {
  -moz-appearance: none;
  border-style: none;
  background-color: -moz-Dialog;
}

%ifdef WINDOWS_AERO
@media not all and (-moz-windows-compositor) {
%endif
  #main-window[tabsintitlebar]:not([inFullscreen]) #toolbar-menubar[inactive] ~ #TabsToolbar:not(:-moz-lwtheme) {
    background: linear-gradient(to top, @toolbarShadowColor@ 1px, transparent 1px),
                linear-gradient(rgba(50%,50%,50%,0), ActiveCaption 85%);
    color: CaptionText;
  }
  #main-window[tabsintitlebar]:not([inFullscreen]) #toolbar-menubar[inactive] ~ #TabsToolbar:not(:-moz-lwtheme):-moz-window-inactive {
    background: linear-gradient(to top, @toolbarShadowColor@ 1px, transparent 1px),
                linear-gradient(rgba(50%,50%,50%,0), InactiveCaption 85%);
    color: InactiveCaptionText;
  }

  #main-window[tabsintitlebar] #titlebar:-moz-lwtheme {
    visibility: hidden;
  }
  #main-window[tabsintitlebar] #titlebar-content:-moz-lwtheme {
    -moz-binding: url("chrome://global/content/bindings/general.xml#windowdragbox");
    visibility: visible;
  }
%ifdef WINDOWS_AERO
}
%endif

#nav-bar[tabsontop=true]:not(:-moz-lwtheme),
#nav-bar[tabsontop=true][collapsed=true]:not([customizing]):not(:-moz-lwtheme) + toolbar,
#nav-bar[tabsontop=true][collapsed=true]:not([customizing]):not(:-moz-lwtheme) + #customToolbars + #PersonalToolbar {
  background-image: linear-gradient(@toolbarHighlight@, rgba(255,255,255,0));
}

#nav-bar[tabsontop=true]:-moz-lwtheme,
#nav-bar[tabsontop=true][collapsed=true]:not([customizing]):-moz-lwtheme + toolbar,
#nav-bar[tabsontop=true][collapsed=true]:not([customizing]):-moz-lwtheme + #customToolbars + #PersonalToolbar {
  background-image: linear-gradient(rgba(255,255,255,.8), rgba(255,255,255,0));
}

#nav-bar[tabsontop=true]:-moz-lwtheme-brighttext,
#nav-bar[tabsontop=true][collapsed=true]:not([customizing]):-moz-lwtheme-brighttext + toolbar,
#nav-bar[tabsontop=true][collapsed=true]:not([customizing]):-moz-lwtheme-brighttext + #customToolbars + #PersonalToolbar {
  background-image: linear-gradient(rgba(32,32,32,.8), rgba(32,32,32,0));
}

#personal-bookmarks {
  min-height: 24px;
}

#print-preview-toolbar:not(:-moz-lwtheme) {
  -moz-appearance: toolbox;
}

#browser-bottombox:not(:-moz-lwtheme) {
  background-color: -moz-dialog;
}

/* ::::: app menu button ::::: */

#appmenu-button {
  -moz-appearance: none;
  background-clip: padding-box;
  border-radius: 0 0 4px 4px;
  border: 1px solid;
  border-top: none;
  color: white;
  text-shadow: 0 0 1px rgba(0,0,0,.7),
               0 1px 1.5px rgba(0,0,0,.5);
  font-weight: bold;
  padding: 0 1.5em .05em;
  margin: 0 0 2px;
}

@media (-moz-windows-classic) {
  #appmenu-button {
    margin-bottom: 1px;
  }
}

%ifndef WINDOWS_AERO
@media (-moz-windows-default-theme) {
  #main-window[sizemode="normal"] #appmenu-button {
    margin-bottom: 5px;
  }
}
%endif

#appmenu-button:hover:active,
#appmenu-button[open] {
  border-radius: 0;
}

%ifdef MOZ_OFFICIAL_BRANDING
#appmenu-button {
  background-image: linear-gradient(rgb(82,182,247), rgb(10,98,215) 95%);
  border-color: rgba(6,42,83,.9);
  box-shadow: 0 1px 0 rgba(255,255,255,.25) inset,
              0 0 0 1px rgba(255,255,255,.25) inset;
}
#appmenu-button:hover:not(:active):not([open]) {
  background-image: radial-gradient(farthest-side at bottom, rgba(89,240,252,.5) 10%, rgba(89,240,252,0) 70%),
                    radial-gradient(farthest-side at bottom, rgb(60,68,236), rgba(172,229,255,0)),
                    linear-gradient(rgb(69,170,246), rgb(30,40,209) 95%);
  border-color: rgba(6,42,83,.9);
  box-shadow: 0 1px 0 rgba(255,255,255,.1) inset,
              0 0 2px 1px rgba(169,234,250,.7) inset,
              0 -1px 0 rgba(169,234,250,.5) inset;
}
#appmenu-button:hover:active,
#appmenu-button[open] {
  background-image: linear-gradient(rgb(69,170,246), rgb(0,74,209) 95%);
  box-shadow: 0 2px 3px rgba(0,0,0,.4) inset,
              0 1px 1px rgba(0,0,0,.2) inset;
}
%else
%if MOZ_UPDATE_CHANNEL == aurora
#appmenu-button {
  background-image: linear-gradient(hsl(208,99%,37%), hsl(214,90%,23%) 95%);
  border-color: hsla(214,89%,21%,.9);
  box-shadow: 0 1px 0 hsla(205,100%,72%,.2) inset,
              0 0 2px 1px hsla(205,100%,72%,.25) inset;
}
#appmenu-button:hover:not(:active):not([open]) {
  background-image: radial-gradient(farthest-side at bottom, hsla(202,100%,85%,.5) 10%, hsla(202,100%,85%,0) 70%),
                    radial-gradient(farthest-side at bottom, hsla(205,100%,72%,.7), hsla(205,100%,72%,0)),
                    linear-gradient(hsl(208,98%,34%), hsl(213,87%,20%) 95%);
  border-color: hsla(214,89%,21%,.9);
  box-shadow: 0 1px 0 hsla(205,100%,72%,.15) inset,
              0 0 2px 1px hsla(205,100%,72%,.5) inset,
              0 -1px 0 hsla(205,100%,72%,.2) inset;
}
#appmenu-button:hover:active,
#appmenu-button[open] {
  background-image: linear-gradient(hsl(208,95%,30%), hsl(214,85%,17%) 95%);
  box-shadow: 0 2px 3px rgba(0,0,0,.4) inset,
              0 1px 1px rgba(0,0,0,.2) inset;
}
%else
#appmenu-button {
  background-image: linear-gradient(hsl(211,33%,32%), hsl(209,53%,10%) 95%);
  border-color: hsla(210,59%,13%,.9);
  box-shadow: 0 1px 0 hsla(210,48%,90%,.15) inset,
              0 0 2px 1px hsla(211,65%,85%,.15) inset;
}
#appmenu-button:hover:not(:active):not([open]) {
  background-image: radial-gradient(farthest-side at bottom, hsla(210,48%,90%,.5) 10%, hsla(210,48%,90%,0) 70%),
                    radial-gradient(farthest-side at bottom, hsla(211,70%,83%,.5), hsla(211,70%,83%,0)),
                    linear-gradient(hsl(211,33%,32%), hsl(209,53%,10%) 95%);
  border-color: hsla(210,59%,13%,.9);
  box-shadow: 0 1px 0 hsla(210,48%,90%,.15) inset,
              0 0 2px 1px hsla(210,48%,90%,.4) inset,
              0 -1px 0 hsla(210,48%,90%,.2) inset;
}
#appmenu-button:hover:active,
#appmenu-button[open] {
  background-image: linear-gradient(hsl(211,33%,26%), hsl(209,53%,6%) 95%);
  box-shadow: 0 2px 3px rgba(0,0,0,.4) inset,
              0 1px 1px rgba(0,0,0,.2) inset;
}
%endif
%endif

#main-window[privatebrowsingmode=temporary] #appmenu-button {
  background-image: linear-gradient(rgb(153,38,211), rgb(105,19,163) 95%);
  border-color: rgba(43,8,65,.9);
}

#main-window[privatebrowsingmode=temporary] #appmenu-button:hover:not(:active):not([open]) {
  background-image: radial-gradient(farthest-side at bottom, rgba(240,193,255,.5) 10%, rgba(240,193,255,0) 70%),
                    radial-gradient(farthest-side at bottom, rgb(192,81,247), rgba(236,172,255,0)),
                    linear-gradient(rgb(144,20,207), rgb(95,0,158) 95%);
  border-color: rgba(43,8,65,.9);
  box-shadow: 0 1px 0 rgba(255,255,255,.1) inset,
              0 0 2px 1px rgba(240,193,255,.7) inset,
              0 -1px 0 rgba(240,193,255,.5) inset;
}

#main-window[privatebrowsingmode=temporary] #appmenu-button:hover:active,
#main-window[privatebrowsingmode=temporary] #appmenu-button[open] {
  background-image: linear-gradient(rgb(144,20,207), rgb(95,0,158) 95%);
}

#appmenu-button > .button-box {
  border-style: none;
  padding: 0;
}

#appmenu-button > .button-box > .button-menu-dropmarker {
  list-style-image: url(appmenu-dropmarker.png);
  width: auto;
  height: auto;
  padding: 0;
  margin: 0;
  -moz-margin-start: .5em;
}

.splitmenu-menuitem {
  -moz-margin-end: 1px;
%ifdef WINDOWS_AERO
  -moz-padding-end: 0.5em;
%endif
}

.splitmenu-menu {
  -moz-box-pack: end;
}

.appmenu-edit-button {
  -moz-appearance: none;
  border: 1px solid transparent;
  padding: 2px;
  background: transparent;
  border-radius: 3px;
}

.appmenu-edit-button[disabled="true"] {
  opacity: .3;
}

#appmenuPrimaryPane {
  -moz-border-end: 1px solid ThreeDShadow;
}

@media (-moz-windows-default-theme) {
  #appmenu-popup {
    -moz-appearance: none;
    background: white;
    border: 1px solid ThreeDShadow;
  }
  #appmenuPrimaryPane {
    background-color: rgba(255,255,255,0.5);
    padding: 2px;
    -moz-border-end: none;
  }
  #appmenuSecondaryPane {
    background-color: #f1f5fb;
    box-shadow: 1px 0 2px rgb(204,214,234) inset;
    -moz-padding-start: 3px;
    -moz-padding-end: 2px;
    padding-top: 2px;
    padding-bottom: 2px;
    font-family: "Segoe UI Semibold", "Segoe UI", sans-serif;
  }
  #appmenuSecondaryPane:-moz-locale-dir(rtl) {
    box-shadow: -1px 0 2px rgb(204,214,234) inset;
  }

%ifdef WINDOWS_AERO
  #appmenuPrimaryPane menupopup {
    -moz-appearance: none;
    background-image: linear-gradient(to right, white 26px, ThreeDLightShadow 26px,
                                      ThreeDLightShadow 27px, ThreeDHighlight 27px,
                                      ThreeDHighlight 28px, white 28px);
    border: 3px solid;
    -moz-border-top-colors: ThreeDShadow white;
    -moz-border-bottom-colors: ThreeDShadow white;
    -moz-border-left-colors: ThreeDShadow white;
    -moz-border-right-colors: ThreeDShadow white;
  }
%endif

  #appmenuSecondaryPane menupopup {
    -moz-appearance: none;
%ifdef WINDOWS_AERO
    background-image: linear-gradient(to right, #f1f5fb 26px, ThreeDLightShadow 26px,
                                      ThreeDLightShadow 27px, ThreeDHighlight 27px,
                                      ThreeDHighlight 28px, #f1f5fb 28px);
    border: 3px solid;
    -moz-border-top-colors: ThreeDShadow #f1f5fb;
    -moz-border-bottom-colors: ThreeDShadow #f1f5fb;
    -moz-border-left-colors: ThreeDShadow #f1f5fb;
    -moz-border-right-colors: ThreeDShadow #f1f5fb;
%else
    background-color: #f1f5fb;
    border: 1px solid ThreeDShadow;
    padding: 2px;
%endif
  }

%ifdef WINDOWS_AERO
  #appmenuPrimaryPane menupopup:-moz-locale-dir(rtl) {
    background-image: linear-gradient(to left, white 26px, ThreeDLightShadow 26px,
                                      ThreeDLightShadow 27px, ThreeDHighlight 27px,
                                      ThreeDHighlight 28px, white 28px);
  }
  #appmenuSecondaryPane menupopup:-moz-locale-dir(rtl) {
    background-image: linear-gradient(to left, #f1f5fb 26px, ThreeDLightShadow 26px,
                                      ThreeDLightShadow 27px, ThreeDHighlight 27px,
                                      ThreeDHighlight 28px, #f1f5fb 28px);
  }

  /* Hi-DPI overrides of the menu backgrounds, to adjust where the gutter line falls */
  @media (min-resolution: 1.25dppx) {
    #appmenuPrimaryPane menupopup {
      background-image: linear-gradient(to right, white 22.4px, ThreeDLightShadow 22.4px,
                                        ThreeDLightShadow 23.2px, ThreeDHighlight 23.2px,
                                        ThreeDHighlight 24px, white 24px);
    }
    #appmenuSecondaryPane menupopup {
      background-image: linear-gradient(to right, #f1f5fb 22.4px, ThreeDLightShadow 22.4px,
                                        ThreeDLightShadow 23.2px, ThreeDHighlight 23.2px,
                                        ThreeDHighlight 24px, #f1f5fb 24px);
    }
    #appmenuPrimaryPane menupopup:-moz-locale-dir(rtl) {
      background-image: linear-gradient(to left, white 22.4px, ThreeDLightShadow 22.4px,
                                        ThreeDLightShadow 23.2px, ThreeDHighlight 23.2px,
                                        ThreeDHighlight 24px, white 24px);
    }
    #appmenuSecondaryPane menupopup:-moz-locale-dir(rtl) {
      background-image: linear-gradient(to left, #f1f5fb 22.4px, ThreeDLightShadow 22.4px,
                                        ThreeDLightShadow 23.2px, ThreeDHighlight 23.2px,
                                        ThreeDHighlight 24px, #f1f5fb 24px);
    }
  }

  @media (min-resolution: 1.5dppx) {
    #appmenuPrimaryPane menupopup {
      background-image: linear-gradient(to right, white 20.6667px, ThreeDLightShadow 20.6667px,
                                        ThreeDLightShadow 21.3333px, ThreeDHighlight 21.3333px,
                                        ThreeDHighlight 22px, white 22px);
    }
    #appmenuSecondaryPane menupopup {
      background-image: linear-gradient(to right, #f1f5fb 20.6667px, ThreeDLightShadow 20.6667px,
                                        ThreeDLightShadow 21.3333px, ThreeDHighlight 21.3333px,
                                        ThreeDHighlight 22px, #f1f5fb 22px);
    }
    #appmenuPrimaryPane menupopup:-moz-locale-dir(rtl) {
      background-image: linear-gradient(to left, white 20.6667px, ThreeDLightShadow 20.6667px,
                                        ThreeDLightShadow 21.3333px, ThreeDHighlight 21.3333px,
                                        ThreeDHighlight 22px, white 22px);
    }
    #appmenuSecondaryPane menupopup:-moz-locale-dir(rtl) {
      background-image: linear-gradient(to left, #f1f5fb 20.6667px, ThreeDLightShadow 20.6667px,
                                        ThreeDLightShadow 21.3333px, ThreeDHighlight 21.3333px,
                                        ThreeDHighlight 22px, #f1f5fb 22px);
    }
  }

  @media (min-resolution: 2dppx) {
    #appmenuPrimaryPane menupopup {
      background-image: linear-gradient(to right, white 19.5px, ThreeDLightShadow 19.5px,
                                        ThreeDLightShadow 20px, ThreeDHighlight 20px,
                                        ThreeDHighlight 20.5px, white 20.5px);
    }
    #appmenuSecondaryPane menupopup {
      background-image: linear-gradient(to right, #f1f5fb 19.5px, ThreeDLightShadow 19.5px,
                                        ThreeDLightShadow 20px, ThreeDHighlight 20px,
                                        ThreeDHighlight 20.5px, #f1f5fb 20.5px);
    }
    #appmenuPrimaryPane menupopup:-moz-locale-dir(rtl) {
      background-image: linear-gradient(to left, white 19.5px, ThreeDLightShadow 19.5px,
                                        ThreeDLightShadow 20px, ThreeDHighlight 20px,
                                        ThreeDHighlight 20.5px, white 20.5px);
    }
    #appmenuSecondaryPane menupopup:-moz-locale-dir(rtl) {
      background-image: linear-gradient(to left, #f1f5fb 19.5px, ThreeDLightShadow 19.5px,
                                        ThreeDLightShadow 20px, ThreeDHighlight 20px,
                                        ThreeDHighlight 20.5px, #f1f5fb 20.5px);
    }
  }
%endif

  .appmenu-menuseparator {
    -moz-appearance: none;
    margin-top: 3px;
    margin-bottom: 3px;
%ifdef WINDOWS_AERO
    -moz-margin-start: 30px;
%else
    -moz-margin-start: calc(1.45em + 4px);
%endif
    padding: 0;
    border-top: 1px solid #d6e5f5;
    border-bottom: none;
  }

%ifdef WINDOWS_AERO
  @media (min-resolution: 1.25dppx) {
    .appmenu-menuseparator {
      -moz-margin-start: 25px;
    }
  }
  @media (min-resolution: 1.5dppx) {
    .appmenu-menuseparator {
      -moz-margin-start: 24px;
    }
  }
  @media (min-resolution: 2dppx) {
    .appmenu-menuseparator {
      -moz-margin-start: 22px;
    }
  }
%endif

  .appmenu-edit-button:not([disabled]):hover {
    border: 1px solid #b8d6fb;
    box-shadow: inset 0 0 1px white;
    background: linear-gradient(#fafbfd, #ebf3fd);
    transition: .2s ease-in;
  }
}

#appmenuSecondaryPane-spacer {
  min-height: 1em;
}

#appmenu-editmenu {
  -moz-box-pack: end;
}

#appmenu_print,
#appmenu_print_popup,
.appmenu-edit-button,
#appmenu-editmenu-cut,
#appmenu-editmenu-copy,
#appmenu-editmenu-paste,
#appmenu-quit {
  list-style-image: url("appmenu-icons.png");
}

#appmenu-cut,
#appmenu-editmenu-cut {
  -moz-image-region: rect(0 16px 16px 0);
}

#appmenu-copy,
#appmenu-editmenu-copy {
  -moz-image-region: rect(0 32px 16px 16px);
}

#appmenu-paste,
#appmenu-editmenu-paste {
  -moz-image-region: rect(0 48px 16px 32px);
}

#appmenu_print,
#appmenu_print_popup {
  -moz-image-region: rect(0 64px 16px 48px);
}

#appmenu-quit {
  -moz-image-region: rect(0 80px 16px 64px);
}

#appmenu-edit-label {
  -moz-appearance: none;
  background: transparent;
  font-style: italic;
}

#appmenu_bookmarks {
  list-style-image: url("chrome://browser/skin/places/bookmark.png");
  -moz-image-region: rect(0px 48px 16px 32px);
}

#appmenu_privateBrowsing,
#appmenu_newPrivateWindow {
  list-style-image: url("chrome://browser/skin/Privacy-16.png");
}

@media (min-resolution: 1.25dppx) {
  #appmenu_privateBrowsing,
  #appmenu_newPrivateWindow {
    list-style-image: url("chrome://browser/skin/Privacy-32.png");
  }
}

#appmenu_addons {
  list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric-16.png");
}

@media (min-resolution: 1.25dppx) {
  #appmenu_addons {
    list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric.png");
  }
}

#appmenu_showAllBookmarks,
#bookmarksShowAll,
#BMB_bookmarksShowAll {
  list-style-image: url("chrome://browser/skin/places/allBookmarks.png");
}

#appmenu_bookmarkThisPage,
#menu_bookmarkThisPage,
#BMB_bookmarkThisPage {
  list-style-image: url("chrome://browser/skin/places/bookmark.png");
  -moz-image-region: rect(0 16px 16px 0);
}

#appmenu_showAllHistory,
#menu_showAllHistory,
#HMB_showAllHistory {
  list-style-image: url("chrome://browser/skin/places/history.png");
}

#appmenu_sanitizeHistory,
#sanitizeItem,
#HMB_sanitizeItem {
  list-style-image: url("chrome://browser/skin/sanitize.png");
}

/* ::::: titlebar ::::: */

#main-window[sizemode="normal"] > #titlebar {
  -moz-appearance: -moz-window-titlebar;
}

#main-window[sizemode="maximized"] > #titlebar {
  -moz-appearance: -moz-window-titlebar-maximized;
}

@media (-moz-windows-classic) {
  #main-window[sizemode="normal"] > #titlebar > #titlebar-content > #appmenu-button-container {
    margin-top: 4px;
  }
}

#titlebar-buttonbox {
  -moz-appearance: -moz-window-button-box;
}

#main-window[sizemode="maximized"] #titlebar-buttonbox {
  -moz-appearance: -moz-window-button-box-maximized;
}

.titlebar-placeholder[type="appmenu-button"] {
  margin-left: 4px;
}

.titlebar-placeholder[type="caption-buttons"] {
%ifdef WINDOWS_AERO
  margin-left: 22px; /* additional space for Aero Snap */
%else
  margin-left: 10px;
%endif
}

/* titlebar command buttons */

#titlebar-min {
  -moz-appearance: -moz-window-button-minimize;
}

#titlebar-max {
  -moz-appearance: -moz-window-button-maximize;
}

#main-window[sizemode="maximized"] #titlebar-max {
  -moz-appearance: -moz-window-button-restore;
}

#titlebar-close {
  -moz-appearance: -moz-window-button-close;
}

@media not all and (-moz-windows-classic) {
  #titlebar-min {
    -moz-margin-end: 2px;
  }
}

/* ::::: bookmark buttons ::::: */

toolbarbutton.bookmark-item {
  margin: 0;
  padding: 2px 3px;
}

toolbarbutton.bookmark-item:hover:active:not([disabled="true"]),
toolbarbutton.bookmark-item[open="true"] {
  padding-top: 3px;
  padding-bottom: 1px;
  -moz-padding-start: 4px;
  -moz-padding-end: 2px;
}

.bookmark-item:not(#bookmarks-menu-button) > .toolbarbutton-icon {
  width: 16px;
  height: 16px;
}

/* Prevent [mode="icons"] from hiding the label */
.bookmark-item > .toolbarbutton-text {
  display: -moz-box !important;
}

.bookmark-item > .toolbarbutton-menu-dropmarker {
  display: none;
}

#wrapper-personal-bookmarks[place="palette"] > .toolbarpaletteitem-box {
  background: url("chrome://browser/skin/places/bookmarksToolbar.png") no-repeat center;
}

.bookmarks-toolbar-customize {
  max-width: 15em !important;
  list-style-image: url("chrome://browser/skin/places/bookmarksToolbar.png") !important;
}

/* ::::: bookmark menus ::::: */

menu.bookmark-item,
menuitem.bookmark-item {
  min-width: 0;
  max-width: 32em;
}

.bookmark-item > .menu-iconic-left {
  margin-top: 0;
  margin-bottom: 0;
}

.bookmark-item > .menu-iconic-left > .menu-iconic-icon {
  -moz-padding-start: 0px;
}

/* ::::: bookmark items ::::: */

.bookmark-item  {
  list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
}

.bookmark-item[container] {
  list-style-image: url("chrome://global/skin/icons/folder-item.png");
  -moz-image-region: rect(0px, 32px, 16px, 16px);
}

.bookmark-item[container][open] {
  -moz-image-region: rect(16px, 32px, 32px, 16px);
}

.bookmark-item[container][livemark] {
  list-style-image: url("chrome://browser/skin/livemark-folder.png");
  -moz-image-region: auto;
}

.bookmark-item[container][livemark] .bookmark-item {
  list-style-image: url("chrome://browser/skin/places/livemark-item.png");
  -moz-image-region: rect(0px, 16px, 16px, 0px);
}

.bookmark-item[container][livemark] .bookmark-item[visited] {
  -moz-image-region: rect(0px, 32px, 16px, 16px);
}

.bookmark-item[container][query] {
  list-style-image: url("chrome://browser/skin/places/query.png");
  -moz-image-region: auto;
}

.bookmark-item[query][tagContainer] {
  list-style-image: url("chrome://browser/skin/places/tag.png");
  -moz-image-region: auto;
}

.bookmark-item[query][dayContainer] {
  list-style-image: url("chrome://browser/skin/places/calendar.png");
  -moz-image-region: auto;
}

.bookmark-item[query][hostContainer] {
  list-style-image: url("chrome://global/skin/icons/folder-item.png");
  -moz-image-region: rect(0px, 32px, 16px, 16px);
}

.bookmark-item[query][hostContainer][open] {
  list-style-image: url("chrome://global/skin/icons/folder-item.png");
  -moz-image-region: rect(16px, 32px, 32px, 16px);
}

.bookmark-item[cutting] > .toolbarbutton-icon,
.bookmark-item[cutting] > .menu-iconic-left > .menu-iconic-icon {
  opacity: 0.5;
}

.bookmark-item[cutting] > .toolbarbutton-text,
.bookmark-item[cutting] > .menu-iconic-left > .menu-iconic-text {
  opacity: 0.7;
}

/* ::::: primary toolbar buttons ::::: */

.toolbarbutton-1 {
  list-style-image: url("chrome://browser/skin/Toolbar.png");
}

toolbar[brighttext] .toolbarbutton-1 {
  list-style-image: url("chrome://browser/skin/Toolbar-inverted.png");
}
%ifdef WINDOWS_AERO
.toolbarbutton-1:not(:-moz-lwtheme) {
  list-style-image: url("chrome://browser/skin/Toolbar-glass.png");
}
%endif

.toolbarbutton-1[disabled=true] > .toolbarbutton-icon,
.toolbarbutton-1[disabled=true] > .toolbarbutton-menu-dropmarker,
.toolbarbutton-1[disabled=true] > .toolbarbutton-menubutton-dropmarker,
.toolbarbutton-1[disabled=true] > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
.toolbarbutton-1 > .toolbarbutton-menubutton-button[disabled] > .toolbarbutton-icon {
  opacity: .4;
}

.toolbarbutton-1 > .toolbarbutton-menu-dropmarker,
.toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
  list-style-image: url("chrome://browser/skin/toolbarbutton-dropdown-arrow.png");
}

toolbar[brighttext] .toolbarbutton-1 > .toolbarbutton-menu-dropmarker,
toolbar[brighttext] .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
  list-style-image: url("chrome://browser/skin/toolbarbutton-dropdown-arrow-inverted.png");
}

.toolbarbutton-1 > .toolbarbutton-icon,
.toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon {
  -moz-margin-end: 0;
}

toolbar[mode=full] .toolbarbutton-1:not([type=menu-button]) {
  -moz-box-orient: vertical;
}

toolbar[mode=full] .toolbarbutton-1,
toolbar[mode=full] .toolbarbutton-1 > .toolbarbutton-menubutton-button {
  min-width: 57px;
}

#nav-bar {
  /* force iconsize="small" on this toolbar */
  counter-reset: smallicons;
}

@navbarLargeIcons@ .toolbarbutton-1,
@navbarLargeIcons@ .toolbarbutton-1 > .toolbarbutton-menubutton-button {
  -moz-appearance: none;
  border: none;
  padding: 0;
  background: none;
}

@navbarLargeIcons@ .toolbarbutton-1:not([type=menu-button]),
@navbarLargeIcons@ .toolbarbutton-1 > .toolbarbutton-menubutton-button,
@navbarLargeIcons@ .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
  padding: 5px 2px;
  -moz-box-pack: center;
}

@navbarLargeIcons@ .toolbarbutton-1[type=menu]:not(#back-button):not(#forward-button):not(#feed-button) {
  padding-left: 5px;
  padding-right: 5px;
}

@navbarLargeIcons@ .toolbarbutton-1 > menupopup {
  margin-top: -3px;
}

@navbarLargeIcons@ .toolbarbutton-1 > .toolbarbutton-menubutton-button {
  -moz-padding-end: 0;
}

@navbarLargeIcons@ .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
  -moz-padding-start: 0;
  -moz-box-align: center;
}

@navbarLargeIcons@ .toolbarbutton-1 > .toolbarbutton-icon,
@navbarLargeIcons@ .toolbarbutton-1 > .toolbarbutton-badge-container,
@navbarLargeIcons@ .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
@navbarLargeIcons@ .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
  padding: 2px 6px;
  background: hsla(210,32%,93%,.3) padding-box;
  background-image: linear-gradient(hsla(0,0%,100%,.4), hsla(0,0%,100%,.1));
  background-clip: padding-box;
  border-radius: 2.5px;
  border: 1px solid;
  border-color: hsla(210,54%,20%,.2) hsla(210,54%,20%,.2) hsla(210,54%,20%,.2);
  box-shadow: 0 1px hsla(0,0%,100%,.05) inset,
              0 1px hsla(210,54%,20%,.05),
              0 0 2px hsla(210,54%,20%,.05);
}

@media (-moz-os-version: windows-win10) {
  /* Square is the new round, courtesy of microsoft */
  @navbarLargeIcons@ .toolbarbutton-1 > .toolbarbutton-icon,
  @navbarLargeIcons@ .toolbarbutton-1 > .toolbarbutton-badge-container,
  @navbarLargeIcons@ .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
  @navbarLargeIcons@ .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
    border-radius: 0px;
  }

  @conditionalForwardWithUrlbar2@ > #forward-button:-moz-locale-dir(ltr) > .toolbarbutton-icon {
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
  }

  @conditionalForwardWithUrlbar2@ > #forward-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
  }
}

@navbarLargeIcons@ .toolbarbutton-1:not(:-moz-any(@primaryToolbarButtons@)) > .toolbarbutton-icon,
@navbarLargeIcons@ .toolbarbutton-1:not(:-moz-any(@primaryToolbarButtons@)) > .toolbarbutton-badge-container,
@navbarLargeIcons@ .toolbarbutton-1:not(:-moz-any(@primaryToolbarButtons@)) > .toolbarbutton-menubutton-button > .toolbarbutton-icon {
  padding: 3px 7px;
}

@navbarLargeIcons@ .toolbarbutton-1[type=menu]:not(#back-button):not(#forward-button):not(#feed-button) > .toolbarbutton-icon,
@navbarLargeIcons@ .toolbarbutton-1[type=menu] > .toolbarbutton-text /* hack for add-ons that forcefully display the label */ {
  -moz-padding-end: 17px;
}

@navbarLargeIcons@ .toolbarbutton-1 > .toolbarbutton-menu-dropmarker {
  -moz-margin-start: -15px;
}

@navbarLargeIcons@ .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon {
  -moz-border-end: none;
}

@navbarLargeIcons@ .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
  padding: 8px 5px 7px;
}

@navbarLargeIcons@ .toolbarbutton-1:not(:hover):not(:active):not([open]) > .toolbarbutton-menubutton-dropmarker::before {
  content: "";
  display: -moz-box;
  width: 1px;
  height: 18px;
  -moz-margin-end: -1px;
  background-image: linear-gradient(hsla(210,54%,20%,.2) 0, hsla(210,54%,20%,.2) 18px);
  background-clip: padding-box;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1px 18px;
  box-shadow: 0 0 0 1px hsla(0,0%,100%,.2);
}

@navbarLargeIcons@ .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon:-moz-locale-dir(ltr),
@navbarLargeIcons@ .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon:-moz-locale-dir(rtl) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

@navbarLargeIcons@ .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon:-moz-locale-dir(rtl),
@navbarLargeIcons@ .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon:-moz-locale-dir(ltr) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

@navbarLargeIcons@ .toolbarbutton-1:not([disabled]):not([checked]):not([open]):not(:active):hover > .toolbarbutton-icon,
@navbarLargeIcons@ .toolbarbutton-1:not([disabled]):not([checked]):not([open]):not(:active):hover > .toolbarbutton-badge-container,
@navbarLargeIcons@ .toolbarbutton-1:not([disabled]):-moz-any(:hover,[open]) > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
@navbarLargeIcons@ .toolbarbutton-1:not([disabled]):hover > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
  background-image: linear-gradient(hsla(0,0%,100%,.8), hsla(0,0%,100%,.5));
  border-color: hsla(210,54%,20%,.25) hsla(210,54%,20%,.3) hsla(210,54%,20%,.35);
  box-shadow: 0 1px hsla(0,0%,100%,.3) inset,
              0 1px hsla(210,54%,20%,.03),
              0 0 2px hsla(210,54%,20%,.1);
}

@navbarLargeIcons@ .toolbarbutton-1 > .toolbarbutton-menubutton-button:not([disabled]):not([open]):not(:active):hover > .toolbarbutton-icon,
@navbarLargeIcons@ .toolbarbutton-1:not([buttonover]):not([open]):not(:active):hover > .toolbarbutton-menubutton-dropmarker:not([disabled]) > .dropmarker-icon {
  background-color: hsla(210,48%,96%,.75);
  border-color: hsla(210,54%,20%,.3) hsla(210,54%,20%,.35) hsla(210,54%,20%,.4);
  box-shadow: 0 0 1px hsla(210,54%,20%,.03),
              0 0 2px hsla(210,54%,20%,.1);
}

@navbarLargeIcons@ .toolbarbutton-1:not([disabled]):-moz-any([open],[checked],:hover:active) > .toolbarbutton-icon,
@navbarLargeIcons@ .toolbarbutton-1:not([disabled]):-moz-any([open],[checked],:hover:active) > .toolbarbutton-badge-container,
@navbarLargeIcons@ .toolbarbutton-1 > .toolbarbutton-menubutton-button:not([disabled]):hover:active > .toolbarbutton-icon,
@navbarLargeIcons@ .toolbarbutton-1[open] > .toolbarbutton-menubutton-dropmarker:not([disabled]) > .dropmarker-icon {
  background-image: linear-gradient(hsla(0,0%,100%,.6), hsla(0,0%,100%,.1));
  background-color: hsla(210,54%,20%,.15);
  border-color: hsla(210,54%,20%,.3) hsla(210,54%,20%,.35) hsla(210,54%,20%,.4);
  box-shadow: 0 1px 1px hsla(210,54%,20%,.1) inset,
              0 0 1px hsla(210,54%,20%,.2) inset,
              /* allows windows-keyhole-forward-clip-path to be used for non-hover as well as hover: */
              0 1px 0 hsla(210,54%,20%,0),
              0 0 2px hsla(210,54%,20%,0);
  text-shadow: none;
}

@navbarLargeIcons@ .toolbarbutton-1:-moz-any(:hover,[open]) > .toolbarbutton-menubutton-dropmarker:not([disabled]) > .dropmarker-icon {
  -moz-border-start-color: hsla(210,54%,20%,.35);
}

@navbarLargeIcons@ .toolbarbutton-1[checked]:not(:active):hover > .toolbarbutton-icon {
  background-color: rgba(90%,90%,90%,.4);
  transition: background-color .4s;
}

:-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1,
:-moz-any(#TabsToolbar, #addon-bar) .toolbarbutton-1 > .toolbarbutton-menubutton-button,
.tabbrowser-arrowscrollbox > .scrollbutton-up,
.tabbrowser-arrowscrollbox > .scrollbutton-down {
  -moz-appearance: none;
  border-style: none;
  padding: 0 3px;
}

#TabsToolbar .toolbarbutton-1:not([disabled]):hover,
#TabsToolbar .toolbarbutton-1[open],
#TabsToolbar .toolbarbutton-1 > .toolbarbutton-menubutton-button:not([disabled]):hover,
.tabbrowser-arrowscrollbox > .scrollbutton-up:not([disabled]):hover,
.tabbrowser-arrowscrollbox > .scrollbutton-down:not([disabled]):hover {
  background-image: linear-gradient(rgba(255,255,255,0), rgba(255,255,255,.5)),
                    linear-gradient(transparent, rgba(0,0,0,.25) 30%),
                    linear-gradient(transparent, rgba(0,0,0,.25) 30%);
  background-position: 1px -1px, 0 -1px, 100% -1px;
  background-size: calc(100% - 2px) 100%, 1px 100%, 1px 100%;
  background-repeat: no-repeat;
}

#addon-bar .toolbarbutton-1:not([disabled]):hover,
#addon-bar .toolbarbutton-1[open],
#addon-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button:not([disabled]):hover {
  background-image: linear-gradient(to top, transparent, rgba(0,0,0,.15)),
                    linear-gradient(to top, transparent, rgba(0,0,0,.15) 30%),
                    linear-gradient(to top, transparent, rgba(0,0,0,.15) 30%);
  background-position: left, left, right;
  background-size: auto, 1px 100%, 1px 100%;
  background-repeat: no-repeat;
}

/* unified back/forward button */

#back-button {
  -moz-image-region: rect(0, 18px, 18px, 0);
}

#forward-button {
  -moz-image-region: rect(0, 36px, 18px, 18px);
}

#back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon,
#forward-button:-moz-locale-dir(rtl),
#forward-button:-moz-locale-dir(rtl) > .toolbarbutton-text {
  transform: scaleX(-1);
}

@conditionalForwardWithUrlbar@ {
  -moz-box-align: center;
}

@conditionalForwardWithUrlbar@ > .toolbarbutton-1:-moz-any([disabled],:not([disabled]):not([open]):not(:active)) > .toolbarbutton-icon {
  border-color: hsla(210,54%,20%,.25) hsla(210,54%,20%,.3) hsla(210,54%,20%,.35);
  box-shadow: 0 1px hsla(0,0%,100%,.3) inset,
              0 1px hsla(210,54%,20%,.03),
              0 0 2px hsla(210,54%,20%,.1);
}

@conditionalForwardWithUrlbar@ > #forward-button {
  padding: 0;
}

@conditionalForwardWithUrlbar@ > #forward-button > menupopup {
  margin-top: 1px;
}

@conditionalForwardWithUrlbar@ > #forward-button > .toolbarbutton-icon {
  clip-path: url(chrome://browser/content/browser.xul#windows-keyhole-forward-clip-path);
  -moz-margin-start: -6px !important;
  border-left-style: none;
  border-radius: 0;
  padding-left: 7px;
  padding-right: 3px;
}

@conditionalForwardWithUrlbar2@ > #forward-button:-moz-locale-dir(ltr) > .toolbarbutton-icon {
  border-top-right-radius: 2.5px;
  border-bottom-right-radius: 2.5px;
}

@conditionalForwardWithUrlbar2@ > #forward-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
  border-top-left-radius: 2.5px;
  border-bottom-left-radius: 2.5px;
}

@conditionalForwardWithUrlbar@ > #forward-button:not([disabled]):not([open]):not(:active):hover > .toolbarbutton-icon {
  background-color: hsla(210,48%,96%,.75);
  border-color: hsla(210,54%,20%,.3) hsla(210,54%,20%,.35) hsla(210,54%,20%,.4);
  box-shadow: 0 0 1px hsla(210,54%,20%,.03),
              0 0 2px hsla(210,54%,20%,.1);
}

@conditionalForwardWithUrlbar@ > #back-button {
  -moz-image-region: rect(18px, 20px, 38px, 0);
  padding-top: 3px;
  padding-bottom: 3px;
  -moz-padding-start: 5px;
  -moz-padding-end: 0;
  position: relative;
  z-index: 1;
  border-radius: 0 10000px 10000px 0;
}

@conditionalForwardWithUrlbar@ > #back-button:-moz-locale-dir(rtl) {
  border-radius: 10000px 0 0 10000px;
}

@conditionalForwardWithUrlbar@ > #back-button > menupopup {
  margin-top: -1px;
}

@conditionalForwardWithUrlbar@ > #back-button > .toolbarbutton-icon {
  border-radius: 10000px;
  padding: 5px;
  border: none;
  box-shadow: 0 1px 0 hsla(0,0%,100%,.3) inset,
              0 0 0 1px hsla(0,0%,100%,.3) inset,
              0 0 0 1px hsla(210,54%,20%,.25),
              0 1px 0 hsla(210,54%,20%,.35);
}

@conditionalForwardWithUrlbar@ > #back-button:not([disabled="true"]):not([open="true"]):not(:active):hover > .toolbarbutton-icon {
  background-color: hsla(210,48%,96%,.75);
  box-shadow: 0 1px 0 hsla(0,0%,100%,.3) inset,
              0 0 0 1px hsla(0,0%,100%,.3) inset,
              0 0 0 1px hsla(210,54%,20%,.3),
              0 1px 0 hsla(210,54%,20%,.4),
              0 0 4px hsla(210,54%,20%,.2);
}

@conditionalForwardWithUrlbar@ > #back-button:not([disabled="true"]):hover:active > .toolbarbutton-icon,
@conditionalForwardWithUrlbar@ > #back-button[open="true"] > .toolbarbutton-icon {
  background-color: hsla(210,54%,20%,.15);
  box-shadow: 0 1px 1px hsla(210,54%,20%,.1) inset,
              0 0 1px hsla(210,54%,20%,.2) inset,
              0 0 0 1px hsla(210,54%,20%,.4),
              0 1px 0 hsla(210,54%,20%,.2);
}

@conditionalForwardWithUrlbar@ > #back-button[disabled] > .toolbarbutton-icon {
  box-shadow: 0 0 0 1px hsla(210,54%,20%,.55),
              0 1px 0 hsla(210,54%,20%,.65);
}

.unified-nav-back[_moz-menuactive]:-moz-locale-dir(ltr),
.unified-nav-forward[_moz-menuactive]:-moz-locale-dir(rtl) {
  list-style-image: url("chrome://browser/skin/menu-back.png") !important;
}

.unified-nav-forward[_moz-menuactive]:-moz-locale-dir(ltr),
.unified-nav-back[_moz-menuactive]:-moz-locale-dir(rtl) {
  list-style-image: url("chrome://browser/skin/menu-forward.png") !important;
}

#stop-button {
  -moz-image-region: rect(0, 54px, 18px, 36px);
}

#reload-button {
  -moz-image-region: rect(0, 72px, 18px, 54px);
}

#home-button.bookmark-item {
  list-style-image: url("chrome://browser/skin/Toolbar.png");
}
toolbar[brighttext] #home-button.bookmark-item {
  list-style-image: url("chrome://browser/skin/Toolbar-inverted.png");
}
%ifdef WINDOWS_AERO
#home-button.bookmark-item:not(:-moz-lwtheme) {
  list-style-image: url("chrome://browser/skin/Toolbar-glass.png");
}
%endif

#home-button {
  -moz-image-region: rect(0, 90px, 18px, 72px);
}

#downloads-button {
  -moz-image-region: rect(0, 108px, 18px, 90px);
}

#history-button,
#history-menu-button {
  -moz-image-region: rect(0, 126px, 18px, 108px);
}

#bookmarks-button,
#bookmarks-menu-button {
  -moz-image-region: rect(0, 144px, 18px, 126px);
}

#bookmarks-menu-button.bookmark-item {
  list-style-image: url("chrome://browser/skin/Toolbar.png");
}

toolbar[brighttext] #bookmarks-menu-button.bookmark-item {
  list-style-image: url("chrome://browser/skin/Toolbar-inverted.png");
}
%ifdef WINDOWS_AERO
#bookmarks-menu-button.bookmark-item:not(:-moz-lwtheme) {
  list-style-image: url("chrome://browser/skin/Toolbar-glass.png");
}
%endif

#print-button {
  -moz-image-region: rect(0, 162px, 18px, 144px);
}

#new-tab-button {
  -moz-image-region: rect(0, 180px, 18px, 162px);
}

#new-window-button {
  -moz-image-region: rect(0, 198px, 18px, 180px);
}

#cut-button {
  -moz-image-region: rect(0, 216px, 18px, 198px);
}

#copy-button {
  -moz-image-region: rect(0, 234px, 18px, 216px);
}

#paste-button {
  -moz-image-region: rect(0, 252px, 18px, 234px);
}

#fullscreen-button {
  -moz-image-region: rect(0, 270px, 18px, 252px);
}

#zoom-out-button {
  -moz-image-region: rect(0, 288px, 18px, 270px);
}

#zoom-in-button {
  -moz-image-region: rect(0, 306px, 18px, 288px);
}

#sync-button {
  -moz-image-region: rect(0, 324px, 18px, 306px);
}
#sync-button[status="active"] {
  list-style-image: url("chrome://browser/skin/sync-throbber.png");
  -moz-image-region: rect(0, 18px, 18px, 0);
}

#feed-button {
  -moz-image-region: rect(0, 342px, 18px, 324px);
}

#webrtc-status-button {
  -moz-image-region: rect(0, 360px, 18px, 342px);
}


/* ::::: fullscreen window controls ::::: */

#window-controls {
  -moz-margin-start: 4px;
}

#minimize-button,
#restore-button,
#close-button {
  list-style-image: url("chrome://global/skin/icons/windowControls.png");
  padding: 0;
}

#minimize-button {
  -moz-image-region: rect(0, 16px, 16px, 0);
}
#minimize-button:hover {
  -moz-image-region: rect(16px, 16px, 32px, 0);
}
#minimize-button:hover:active {
  -moz-image-region: rect(32px, 16px, 48px, 0);
}
#restore-button {
  -moz-image-region: rect(0, 32px, 16px, 16px);
}
#restore-button:hover {
  -moz-image-region: rect(16px, 32px, 32px, 16px);
}
#restore-button:hover:active {
  -moz-image-region: rect(32px, 32px, 48px, 16px);
}
#close-button {
  -moz-image-region: rect(0, 48px, 16px, 32px);
  -moz-appearance: none;
  border-style: none;
  margin: 2px;
}
#close-button:hover {
  -moz-image-region: rect(16px, 48px, 32px, 32px);
}
#close-button:hover:active {
  -moz-image-region: rect(32px, 48px, 48px, 32px);
}

/* ::::: Location Bar ::::: */

#urlbar,
.searchbar-textbox {
  -moz-appearance: none;
  margin: 1px 3px;
  padding: 0;
  background-clip: padding-box;
  border: 1px solid ThreeDShadow;
  border-radius: 2px;
}

#urlbar {
  width: 7em;
  -moz-padding-end: 2px;
}

@media (-moz-windows-default-theme) {
  #urlbar,
  .searchbar-textbox {
    @navbarTextboxCustomBorder@
  }
}

#urlbar:-moz-lwtheme,
.searchbar-textbox:-moz-lwtheme {
  background-color: rgba(255,255,255,.8);
  @navbarTextboxCustomBorder@
  color: black;
}

@conditionalForwardWithUrlbar@ + #urlbar-container {
  padding-left: @conditionalForwardWithUrlbarWidth@px;
  -moz-margin-start: -@conditionalForwardWithUrlbarWidth@px;
  position: relative;
  pointer-events: none;
}

@conditionalForwardWithUrlbar@ + #urlbar-container > #urlbar {
  -moz-border-start: none;
  margin-left: 0;
  pointer-events: all;
}

@conditionalForwardWithUrlbar@:not([switchingtabs]) + #urlbar-container > #urlbar {
  transition: margin-left @forwardTransitionLength@ ease-out;
}

@conditionalForwardWithUrlbar@ + #urlbar-container > #urlbar:-moz-locale-dir(ltr) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

@conditionalForwardWithUrlbar@ + #urlbar-container > #urlbar:-moz-locale-dir(rtl) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

@conditionalForwardWithUrlbar@[forwarddisabled] + #urlbar-container {
  clip-path: url("chrome://browser/content/browser.xul#windows-urlbar-back-button-clip-path");
}

@conditionalForwardWithUrlbar@[forwarddisabled] + #urlbar-container > #urlbar {
/*  margin-left: -@conditionalForwardWithUrlbarWidth@px; */
}

@conditionalForwardWithUrlbar@[forwarddisabled]:hover:not([switchingtabs]) + #urlbar-container > #urlbar {
  /* delay the hiding of the forward button when hovered to avoid accidental clicks on the url bar */
  transition-delay: 100s;
}

@conditionalForwardWithUrlbar@[forwarddisabled]:not(:hover) + #urlbar-container > #urlbar {
  /* when not hovered anymore, trigger a new transition to hide the forward button immediately */
/*  margin-left: -@conditionalForwardWithUrlbarWidth@.01px; */
}

@conditionalForwardWithUrlbar@ + #urlbar-container:-moz-locale-dir(rtl),
@conditionalForwardWithUrlbar@ + #urlbar-container > #urlbar:-moz-locale-dir(rtl) {
  /* let windows-urlbar-back-button-mask clip the urlbar's right side for RTL */
  transform: scaleX(-1);
}

html|*.urlbar-input:-moz-lwtheme::-moz-placeholder,
.searchbar-textbox:-moz-lwtheme > .autocomplete-textbox-container > .textbox-input-box > html|*.textbox-input::-moz-placeholder {
  opacity: 1.0;
  color: #777;
}

#urlbar:-moz-lwtheme[focused="true"],
.searchbar-textbox:-moz-lwtheme[focused="true"] {
  background-color: white;
}

#urlbar-container {
  -moz-box-orient: horizontal;
  -moz-box-align: stretch;
}

.urlbar-textbox-container {
  -moz-box-align: stretch;
}

.urlbar-input-box {
  -moz-margin-start: 0;
  min-width: 4em;
}

#urlbar-icons {
  -moz-box-align: center;
}

.urlbar-icon {
  padding: 0 3px;
}

.searchbar-engine-button,
.search-go-container {
  padding: 2px 2px;
}

.urlbar-icon:hover {
  background-image: radial-gradient(circle closest-side, hsla(200,100%,70%,.3), hsla(200,100%,70%,0));
}

.urlbar-icon[open="true"],
.urlbar-icon:hover:active {
  background-image: radial-gradient(circle closest-side, hsla(200,100%,70%,.1), hsla(200,100%,70%,0));
}

#urlbar-search-splitter {
  min-width: 6px;
  -moz-margin-start: -3px;
  border: none;
  background: transparent;
}

#urlbar-search-splitter + #urlbar-container > #urlbar ,
#urlbar-search-splitter + #search-container > #searchbar > .searchbar-textbox {
  -moz-margin-start: 0;
}

#urlbar-display-box {
  -moz-border-end: 1px solid #AAA;
  -moz-margin-end: 3px;
}

#urlbar-display {
  margin-top: 0;
  margin-bottom: 0;
  -moz-margin-start: 0;
  color: GrayText;
}

/* identity box */

#identity-box {
  padding: 2px;
  font-size: .9em;
}

#identity-box:-moz-locale-dir(ltr) {
  border-top-left-radius: 1.5px;
  border-bottom-left-radius: 1.5px;
}

#identity-box:-moz-locale-dir(rtl) {
  border-top-right-radius: 1.5px;
  border-bottom-right-radius: 1.5px;
}

#notification-popup-box:not([hidden]) + #identity-box {
  -moz-padding-start: 10px;
  border-radius: 0;
}

@conditionalForwardWithUrlbar@ + #urlbar-container > #urlbar > #identity-box {
  border-radius: 0;
}

@conditionalForwardWithUrlbar@[forwarddisabled] + #urlbar-container > #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) {
  padding-left: 5px;
  transition: padding-left;
}

@conditionalForwardWithUrlbar@[forwarddisabled] + #urlbar-container > #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) {
  padding-right: 5px;
  transition: padding-right;
}

@conditionalForwardWithUrlbar@[forwarddisabled]:hover:not([switchingtabs]) + #urlbar-container > #urlbar > #notification-popup-box[hidden] + #identity-box {
  /* forward button hiding is delayed when hovered */
  transition-delay: 100s;
}

@conditionalForwardWithUrlbar@[forwarddisabled]:not(:hover) + #urlbar-container > #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) {
  /* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */
  padding-left: 5.01px;
}

@conditionalForwardWithUrlbar@[forwarddisabled]:not(:hover) + #urlbar-container > #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) {
  /* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */
  padding-right: 5.01px;
}

#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity {
  color: hsl(92,100%,20%);
  -moz-margin-end: 4px;
  background-image: -moz-linear-gradient(hsla(92,81%,16%,0),
                                         hsla(92,81%,16%,.08) 25%,
                                         hsla(92,81%,16%,.08) 75%,
                                    hsla(92,81%,16%,0));
  background-position: right;
  background-repeat: no-repeat; 
}

#urlbar[pageproxystate="valid"] > #identity-box.verifiedDomain {
  color: rgb(0,79,168);
  -moz-margin-end: 4px;
  background-image: -moz-linear-gradient(rgba(0,79,168,0),
                                         rgba(0,79,168,.08) 25%,
                                         rgba(0,79,168,.08) 75%,
                                         rgba(0,79,168,0));
  background-position: right;
  background-repeat: no-repeat;
}

#identity-box.verifiedIdentity:-moz-locale-dir(rtl) {
  background-position: left;
}

#identity-box:-moz-focusring {
  outline: 1px dotted #000;
  outline-offset: -3px;
}

#identity-icon-labels {
  -moz-padding-start: 2px;
  -moz-padding-end: 5px;
}

/* Address bar shading for SSL */

#urlbar[https_color="all"][security_level="broken"],
#urlbar[https_color="all"][security_level="low"] {
  box-shadow: inset 0 0 2px rgb(168,0,0);
}

#urlbar[https_color="all"][security_level="mixed"],
#urlbar[https_color="secure-mixed"][security_level="mixed"] {
  box-shadow: inset 0 0 2px rgb(168,79,0);
}

#urlbar[https_color="all"][security_level="high"],
#urlbar[https_color="secure-mixed"][security_level="high"],
#urlbar[https_color="secure-only"][security_level="high"] {
  box-shadow: inset 0 0 2px rgb(0,79,168);
}

#urlbar[https_color="all"][security_level="ev"],
#urlbar[https_color="secure-mixed"][security_level="ev"],
#urlbar[https_color="secure-only"][security_level="ev"] {
  box-shadow: inset 0 0 2px rgb(0,168,0);
}

#urlbar[https_color="all"][security_level="broken"]:not(:-moz-lwtheme),
#urlbar[https_color="all"][security_level="low"]:not(:-moz-lwtheme) {
  box-shadow: inset 0 0 3px rgba(168,0,0,0.8);
}

#urlbar[https_color="all"][security_level="mixed"]:not(:-moz-lwtheme),
#urlbar[https_color="secure-mixed"][security_level="mixed"]:not(:-moz-lwtheme) {
  box-shadow: inset 0 0 3px rgba(168,79,0,0.8);
}

#urlbar[https_color="all"][security_level="high"]:not(:-moz-lwtheme),
#urlbar[https_color="secure-mixed"][security_level="high"]:not(:-moz-lwtheme),
#urlbar[https_color="secure-only"][security_level="high"]:not(:-moz-lwtheme) {
  box-shadow: inset 0 0 3px rgba(0,79,168,0.8);
}

#urlbar[https_color="all"][security_level="ev"]:not(:-moz-lwtheme),
#urlbar[https_color="secure-mixed"][security_level="ev"]:not(:-moz-lwtheme),
#urlbar[https_color="secure-only"][security_level="ev"]:not(:-moz-lwtheme) {
  box-shadow: inset 0 0 3px rgba(0,168,0,0.8);
}

/* Location bar dropmarker */

.urlbar-history-dropmarker {
  -moz-appearance: none;
  padding: 0 3px;
  background-color: transparent;
  border: none;
  width: auto;
  list-style-image: url("chrome://browser/skin/urlbar-history-dropmarker.png");
  -moz-image-region: rect(0px, 11px, 14px, 0px);
}

.urlbar-history-dropmarker:hover {
  background-image: radial-gradient(circle closest-side, hsla(205,100%,70%,.3), hsla(205,100%,70%,0));
  -moz-image-region: rect(0px, 22px, 14px, 11px);
}

.urlbar-history-dropmarker:hover:active,
.urlbar-history-dropmarker[open="true"] {
  background-image: radial-gradient(circle closest-side, hsla(205,100%,70%,.1), hsla(205,100%,70%,0));
  -moz-image-region: rect(0px, 33px, 14px, 22px);
}

/* page proxy icon */

#page-proxy-favicon {
  width: 16px;
  height: 16px;
  margin-top: 1px;
  margin-bottom: 1px;
  -moz-margin-start: 3px;
  -moz-margin-end: 2px;
  list-style-image: url(chrome://browser/skin/identity-icons-generic.png);
  -moz-image-region: rect(0, 16px, 16px, 0);
}

@conditionalForwardWithUrlbar@ + #urlbar-container > #urlbar > #identity-box > #page-proxy-favicon {
  -moz-margin-end: 1px;
}

/* Since we already have a padlock, always use the generic icon until the favicon loads
.verifiedDomain > #page-proxy-favicon[pageproxystate="valid"] {
  list-style-image: url(chrome://browser/skin/identity-icons-https.png);
}

.verifiedIdentity > #page-proxy-favicon[pageproxystate="valid"] {
  list-style-image: url(chrome://browser/skin/identity-icons-https-ev.png);
}

.mixedActiveContent > #page-proxy-favicon[pageproxystate="valid"] {
  list-style-image: url(chrome://browser/skin/identity-icons-https-mixed-active.png);
}
*/

#identity-box:hover > #page-proxy-favicon {
  -moz-image-region: rect(0, 32px, 16px, 16px);
}

#identity-box:hover:active > #page-proxy-favicon,
#identity-box[open=true] > #page-proxy-favicon {
  -moz-image-region: rect(0, 48px, 16px, 32px);
}

#page-proxy-favicon[pageproxystate="invalid"] {
  opacity: 0.3;
}

/* autocomplete */

#treecolAutoCompleteImage {
  max-width: 36px;
}

.ac-result-type-bookmark,
.autocomplete-treebody::-moz-tree-image(bookmark, treecolAutoCompleteImage) {
  list-style-image: url("chrome://browser/skin/places/bookmark.png");
  -moz-image-region: rect(0px 48px 16px 32px);
  width: 16px;
  height: 16px;
}

.ac-result-type-keyword,
.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage) {
  list-style-image: url(chrome://global/skin/icons/Search-glass.png);
  -moz-image-region: rect(0px 32px 16px 16px);
  width: 16px;
  height: 16px;
}

.ac-result-type-tag,
.autocomplete-treebody::-moz-tree-image(tag, treecolAutoCompleteImage) {
  list-style-image: url("chrome://browser/skin/places/tag.png");
  width: 16px;
  height: 16px;
}

.ac-comment {
  font-size: 1.06em;
}

.ac-extra > .ac-comment {
  font-size: 1em;
}

.ac-url-text,
.ac-action-text {
  font-size: 1em;
  color: -moz-nativehyperlinktext;
}

%ifndef WINDOWS_AERO
@media (-moz-windows-default-theme) {
  .ac-url-text:not([selected="true"]),
  .ac-action-text:not([selected="true"]) {
    color: #008800;
  }
}
%endif

richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-icon {
  list-style-image: url("chrome://browser/skin/actionicon-tab.png");
  -moz-image-region: rect(0, 16px, 11px, 0);
  padding: 0 3px;
}

%ifdef WINDOWS_AERO
@media not all and (-moz-windows-default-theme) {
%endif
  richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url-box > .ac-action-icon {
    -moz-image-region: rect(11px, 16px, 22px, 0);
  }

  .ac-comment[selected="true"],
  .ac-url-text[selected="true"],
  .ac-action-text[selected="true"] {
    color: inherit !important;
  }
%ifdef WINDOWS_AERO
}
%endif

.autocomplete-treebody::-moz-tree-cell-text(treecolAutoCompleteComment) {
  color: GrayText;
}

.autocomplete-treebody::-moz-tree-cell-text(suggesthint, treecolAutoCompleteComment),
.autocomplete-treebody::-moz-tree-cell-text(suggestfirst, treecolAutoCompleteComment)
{
  color: GrayText;
  font-size: smaller;
}

.autocomplete-treebody::-moz-tree-cell(suggesthint) {
  border-top: 1px solid GrayText;
}

/* combined go/reload/stop button in location bar */

#go-button,
#urlbar > toolbarbutton {
  -moz-appearance: none;
  padding: 0 2px;
  background-origin: border-box;
  border: none;
  list-style-image: url("chrome://browser/skin/reload-stop-go.png");
}

#go-button {
  padding: 0 3px;
}

#urlbar-reload-button {
  -moz-image-region: rect(0, 14px, 14px, 0);
}

#urlbar-reload-button:not([disabled]):hover {
  background-image: radial-gradient(circle closest-side, hsla(200,100%,70%,.2), hsla(200,100%,70%,0));
  -moz-image-region: rect(14px, 14px, 28px, 0);
}

#urlbar-reload-button:not([disabled]):hover:active {
  background-image: radial-gradient(circle closest-side, hsla(200,100%,60%,.1), hsla(200,100%,60%,0));
  -moz-image-region: rect(28px, 14px, 42px, 0);
}

#urlbar-reload-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
  transform: scaleX(-1);
}

#go-button,
#urlbar-go-button {
  -moz-image-region: rect(0, 42px, 14px, 28px);
}

#go-button:hover,
#urlbar-go-button:hover {
  background-image: radial-gradient(circle closest-side, hsla(110,70%,50%,.2), hsla(110,70%,50%,0));
  -moz-image-region: rect(14px, 42px, 28px, 28px);
}

#go-button:hover:active,
#urlbar-go-button:hover:active {
  background-image: radial-gradient(circle closest-side, hsla(110,70%,50%,.1), hsla(110,70%,50%,0));
  -moz-image-region: rect(28px, 42px, 42px, 28px);
}

#go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon,
#urlbar-go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
  transform: scaleX(-1);
}

#urlbar-stop-button {
  -moz-image-region: rect(0, 28px, 14px, 14px);
}

#urlbar-stop-button:not([disabled]):hover {
  background-image: radial-gradient(circle closest-side, hsla(5,100%,75%,.3), hsla(5,100%,75%,0));
  -moz-image-region: rect(14px, 28px, 28px, 14px);
}

#urlbar-stop-button:hover:active {
  background-image: radial-gradient(circle closest-side, hsla(5,100%,75%,.1), hsla(5,100%,75%,0));
  -moz-image-region: rect(28px, 28px, 42px, 14px);
}

/* popup blocker button */

#page-report-button {
  list-style-image: url("chrome://browser/skin/urlbar-popup-blocked.png");
  -moz-image-region: rect(0, 16px, 16px, 0);
}

#page-report-button:hover {
  -moz-image-region: rect(0, 32px, 16px, 16px);
}

#page-report-button:hover:active,
#page-report-button[open="true"] {
  -moz-image-region: rect(0, 48px, 16px, 32px);
}

/* star button */

#star-button {
  list-style-image: url("chrome://browser/skin/places/bookmark.png");
  -moz-image-region: rect(0px 16px 16px 0px);
}

#star-button:hover {
  background-image: radial-gradient(circle closest-side, hsla(45,100%,73%,.3), hsla(45,100%,73%,0));
  -moz-image-region: rect(0px 32px 16px 16px);
}

#star-button:hover:active {
  background-image: radial-gradient(circle closest-side, hsla(45,100%,73%,.1), hsla(45,100%,73%,0));
  -moz-image-region: rect(0px 48px 16px 32px);
}

#star-button[starred] {
  list-style-image: url("chrome://browser/skin/places/editBookmark.png");
}

/* bookmarking panel */

#editBookmarkPanelStarIcon {
  list-style-image: url("chrome://browser/skin/places/starred48.png");
  width: 48px;
  height: 48px;
}

#editBookmarkPanelStarIcon[unstarred] {
  list-style-image: url("chrome://browser/skin/places/unstarred48.png");
}

#editBookmarkPanelTitle {
  font-size: 130%;
}

#editBookmarkPanelHeader,
#editBookmarkPanelContent {
  margin-bottom: .5em;
}

/* Implements editBookmarkPanel resizing on folderTree un-collapse. */
#editBMPanel_folderTree {
  min-width: 27em;
}

.panel-promo-box {
  margin: 10px -10px -10px;
  padding: 8px 10px;
  border-top: 1px solid ThreeDShadow;
  background-image: linear-gradient(hsla(0,0%,0%,.15), hsla(0,0%,0%,.08) 6px);
  border-bottom-left-radius: 3px;
  border-bottom-right-radius: 3px;
}

@media (-moz-windows-default-theme) {
  .panel-promo-box {
    border-top-style: none;
    background: #f1f5fb;
    color: GrayText;
    box-shadow: 0px 1px 2px rgb(204,214,234) inset;
  }
}

.panel-promo-icon {
  list-style-image: url("chrome://browser/skin/sync-notification-24.png");
  -moz-margin-end: 10px;
  vertical-align: middle;
}

.panel-promo-closebutton {
  -moz-appearance: none;
  border: none;
  -moz-margin-end: -10px;
  margin-top: -5px;
}

.panel-promo-closebutton > .toolbarbutton-text {
  padding: 0;
  margin: 0;
}

/* ::::: content area ::::: */

#sidebar {
  background-color: Window;
}

#sidebar-title {
  -moz-padding-start: 0px;
}

/* ::::: throbber ::::: */

#navigator-throbber {
  width: 16px;
  min-height: 16px;
  margin: 0 3px;
}

#navigator-throbber[busy="true"] {
  list-style-image: url("chrome://global/skin/icons/loading_16.png");
}

#navigator-throbber,
#wrapper-navigator-throbber > #navigator-throbber {
  list-style-image: url("chrome://global/skin/icons/notloading_16.png");
}

/* Tabstrip */

#TabsToolbar {
  min-height: 0;
  padding: 0;
}

/* Make sure the Navigation toolbar buttons are more or less
   vertically centered between the tabs and the AppMenu button
   when the tabs are not on top and the Bookmarks toolbar is
   disabled */
#nav-bar + #customToolbars + #PersonalToolbar:-moz-any([collapsed=true],[moz-collapsed=true]) + #TabsToolbar[tabsontop=false] {
  margin-top: 1px;
}

/* Make sure the elements on the Tab bar are not "glued" right
   up against the AppMenu button / the caption when the tabs are
   on top and the window is unmaximized */
#main-window[sizemode="normal"] #TabsToolbar[tabsontop=true] {
  margin-top: 1px;
}

#TabsToolbar:not(:-moz-lwtheme),
#TabsToolbar[tabsontop=false] {
  background-image: linear-gradient(to top, @toolbarShadowColor@ 1px, rgba(0,0,0,.05) 1px, transparent 50%);
}

%ifndef WINDOWS_AERO
@media (-moz-windows-default-theme) {
  #main-window[sizemode=normal] #TabsToolbar {
    padding-left: 2px;
    padding-right: 2px;
  }
}
%endif

.tabbrowser-tab,
.tabs-newtab-button {
  -moz-appearance: none;
  background: @toolbarShadowOnTab@, @bgTabTexture@,
              linear-gradient(-moz-dialog, -moz-dialog);
  background-clip: padding-box;
  padding: 3px 1px 4px;
  /* Setting a transparent outer border allows us to have a 1px gap
     between the tabs and the top edge of the screen, even when the
     tabs have a top margin of 0, which is important for Fitts' law
     compliance */
  border: 2px solid;
  border-bottom: none;
  border-radius: 6px 6px 0px 0px;
  -moz-border-top-colors: transparent #929292;
  -moz-border-left-colors: transparent #929292;
  -moz-border-right-colors: transparent #929292;
  /* Hide the transparent top border by default */
  margin-top: -1px;
  /* Reduce the gap between the tabs */
  -moz-margin-start: -1px;
  box-shadow: inset 0.5px 1px 1px rgba(255,255,255,.7);
}

.tabbrowser-tab {
  -moz-padding-end: 3px;
}

/* Override the default (globally-set) tab width values; increase
   by 2px to compensate for the transparent outer border of the tabs */
.tabbrowser-tab:not([pinned]) {
  max-width: 252px;
  min-width: 102px;
}

/* When the tabs are on top and the window is maximized or in full-
   screen mode, unhide the transparent top border of the tabs so we
   have a 1px gap between the tabs and the top edge of the screen */
#main-window[sizemode="maximized"][tabsontop=true] .tabbrowser-tab,
#main-window[sizemode="maximized"][tabsontop=true] .tabs-newtab-button,
#main-window[sizemode="fullscreen"][tabsontop=true] .tabbrowser-tab,
#main-window[sizemode="fullscreen"][tabsontop=true] .tabs-newtab-button {
  margin-top: 0px;
}

@media (-moz-os-version: windows-win8) {
  /* Square is the new round, courtesy of microsoft */
  /* We keep the hinting at round here because that's the hybrid in use
     on our other controls in the navigation toolbars */
  .tabbrowser-tab,
  .tabs-newtab-button {
    border-radius: 3.5px 3.5px 0px 0px;
  }
}

@media (-moz-os-version: windows-win10) {
  /* Square is the new round, courtesy of microsoft */
  .tabbrowser-tab,
  .tabs-newtab-button {
    border-radius: 0px;
    box-shadow: none;
  }
}

.tabbrowser-tab:hover,
.tabs-newtab-button:hover {
  background-image: @toolbarShadowOnTab@, @bgTabTextureHover@,
                    linear-gradient(-moz-dialog, -moz-dialog);
}

%ifndef WINDOWS_AERO
@media (-moz-windows-theme: luna-blue) {
  .tabbrowser-tab,
  .tabs-newtab-button {
    background-image: @toolbarShadowOnTab@,
                      linear-gradient(hsla(51,34%,89%,.9), hsla(51,15%,79%,.9) 1px, hsla(51,9%,68%,.9));
  }

  .tabbrowser-tab:hover,
  .tabs-newtab-button:hover {
    background-image: @toolbarShadowOnTab@,
                      linear-gradient(hsla(51,34%,100%,.9), hsla(51,15%,94%,.9) 1px, hsla(51,9%,83%,.9));
  }
}
%endif

.tabbrowser-tab[selected="true"] {
  background-image: linear-gradient(@selectedTabHighlight@, @toolbarHighlight@ 50%),
                    linear-gradient(-moz-dialog, -moz-dialog);
}

#main-window[tabsontop=false]:not([disablechrome]) .tabbrowser-tab[selected=true]:not(:-moz-lwtheme) {
  background-image: @toolbarShadowOnTab@,
                    linear-gradient(@selectedTabHighlight@, @toolbarHighlight@ 50%),
                    linear-gradient(-moz-dialog, -moz-dialog);
}

.tabbrowser-tab:-moz-lwtheme {
  color: inherit;
  /* 0.99 opacity rquired to force an active layer, see bug #1028369 */
  opacity: 0.99;
}

.tabbrowser-tab:-moz-lwtheme:not([selected="true"]) {
  opacity: 0.9;
}

/* Remove highlight fuzz on dark themes */
.tabbrowser-tab:-moz-lwtheme-brighttext,
.tabs-newtab-button:-moz-lwtheme-brighttext {
  box-shadow:none;
  -moz-border-top-colors: transparent #707070;
  -moz-border-left-colors: transparent #707070;
  -moz-border-right-colors: transparent #707070;
}

.tabbrowser-tab[selected="true"]:-moz-lwtheme {
  background-image: linear-gradient(rgba(255,255,255,.6), rgba(255,255,255,.8) 50%);
}

.tabbrowser-tab[selected="true"]:-moz-lwtheme-brighttext {
  background-image: linear-gradient(rgba(128,128,128,.9), rgba(32,32,32,.9) 50%, rgba(32,32,32,.9) 80%, rgba(32,32,32,.8) 100%);
  -moz-border-top-colors: transparent #D0D0D0;
  -moz-border-left-colors: transparent #D0D0D0;
  -moz-border-right-colors: transparent #D0D0D0;
}

.tabbrowser-tab:-moz-lwtheme-brighttext:not([selected="true"]),
.tabs-newtab-button:-moz-lwtheme-brighttext {
  background-image: linear-gradient(hsla(0,0%,25%,.4), hsla(0,0%,15%,.6) 80%);
}

.tabbrowser-tab:-moz-lwtheme-brighttext:not([selected="true"]):hover,
.tabs-newtab-button:-moz-lwtheme-brighttext:hover {
  background-image: linear-gradient(hsla(0,0%,60%,.4), hsla(0,0%,10%,.8) 80%);
}

.tabbrowser-tab:-moz-lwtheme-darktext:not([selected="true"]),
.tabs-newtab-button:-moz-lwtheme-darktext {
  background-image: linear-gradient(hsla(0,0%,75%,.4), hsla(0,0%,85%,.6) 80%);
}

.tabbrowser-tab:-moz-lwtheme-darktext:not([selected="true"]):hover,
.tabs-newtab-button:-moz-lwtheme-darktext:hover {
  background-image: linear-gradient(hsla(0,0%,60%,.4), hsla(0,0%,90%,.8) 80%);
}

.tabbrowser-tab[pinned][titlechanged]:not([selected="true"]) {
  background-image: radial-gradient(circle farthest-corner at 50% 3px, rgba(255,255,255,1) 3%, rgba(186,221,251,.75) 40%, rgba(127,179,255,.5) 80%, rgba(127,179,255,.25));
}
.tabbrowser-tab[pinned][titlechanged]:not([selected="true"]):hover {
  background-image: linear-gradient(hsla(0,0%,100%,.4), hsla(0,0%,75%,.4) 80%),
                    radial-gradient(circle farthest-corner at 50% 3px, rgba(255,255,255,1) 3%, rgba(186,221,251,.75) 40%, rgba(127,179,255,.5) 80%, rgba(127,179,255,.25));
}

.tab-throbber,
.tab-icon-image {
  width: 16px;
  height: 16px;
  list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
  -moz-margin-start: 2px;
  -moz-margin-end: 3px;
}

.tab-throbber {
  list-style-image: url("chrome://browser/skin/tabbrowser/connecting.png");
}

.tab-throbber[progress] {
  list-style-image: url("chrome://browser/skin/tabbrowser/loading.png");
}

.tab-throbber[pinned],
.tab-icon-image[pinned] {
  -moz-margin-start: 5px;
  -moz-margin-end: 5px;
}

/* tabbrowser-tab focus ring */
.tabbrowser-tab:focus > .tab-stack {
  outline: 1px dotted;
}

/* Tab DnD indicator */
.tab-drop-indicator {
  list-style-image: url(chrome://browser/skin/tabbrowser/tabDragIndicator.png);
  margin-bottom: -11px;
}

/* Tab close button */
.tab-close-button {
  -moz-appearance: none;
  border: none;
  padding: 0px;
}

.tab-close-button:not([selected]):not(:hover):not(:active) {
  -moz-image-region: rect(0, 64px, 16px, 48px);
}

.tab-close-button:-moz-lwtheme-brighttext {
  list-style-image: url("chrome://global/skin/icons/close-inverted.png");
}

/* Tab scrollbox arrow, tabstrip new tab and all-tabs buttons */

.tabbrowser-arrowscrollbox > .scrollbutton-up,
.tabbrowser-arrowscrollbox > .scrollbutton-down {
  list-style-image: url("chrome://browser/skin/tabbrowser/tab-arrow-left.png");
  margin: 0;
  padding-right: 2px;
  border-right: 2px solid transparent;
  background-origin: border-box;
}

/* Prevent the icon from being vertically stretched when we unhide
   the transparent top border of the tabs (when the tabs are on top
   and the window is maximized or in full-screen mode) */
#main-window[sizemode="maximized"][tabsontop=true] .tabbrowser-arrowscrollbox > .scrollbutton-up > .toolbarbutton-icon,
#main-window[sizemode="maximized"][tabsontop=true] .tabbrowser-arrowscrollbox > .scrollbutton-down > .toolbarbutton-icon,
#main-window[sizemode="fullscreen"][tabsontop=true] .tabbrowser-arrowscrollbox > .scrollbutton-up > .toolbarbutton-icon,
#main-window[sizemode="fullscreen"][tabsontop=true] .tabbrowser-arrowscrollbox > .scrollbutton-down > .toolbarbutton-icon {
  margin-bottom: 1px;
}

%ifdef WINDOWS_AERO
.tabbrowser-arrowscrollbox > .scrollbutton-up:-moz-system-metric(windows-compositor):not(:-moz-lwtheme),
.tabbrowser-arrowscrollbox > .scrollbutton-down:-moz-system-metric(windows-compositor):not(:-moz-lwtheme) {
  list-style-image: url(chrome://browser/skin/tabbrowser/tab-arrow-left-glass.png);
}
%endif

toolbar[brighttext] .tabbrowser-arrowscrollbox > .scrollbutton-up,
toolbar[brighttext] .tabbrowser-arrowscrollbox > .scrollbutton-down {
  list-style-image: url(chrome://browser/skin/tabbrowser/tab-arrow-left-inverted.png);
}

.tabbrowser-arrowscrollbox > .scrollbutton-up[disabled],
.tabbrowser-arrowscrollbox > .scrollbutton-down[disabled] {
  opacity: .4;
}

.tabbrowser-arrowscrollbox > .scrollbutton-up:-moz-locale-dir(rtl),
.tabbrowser-arrowscrollbox > .scrollbutton-down:-moz-locale-dir(ltr) {
  transform: scaleX(-1);
}

.tabbrowser-arrowscrollbox > .scrollbutton-down {
  transition: 1s background-color ease-out;
}

.tabbrowser-arrowscrollbox > .scrollbutton-down[notifybgtab] {
  background-color: Highlight;
  transition: none;
}

.tabbrowser-arrowscrollbox > .scrollbutton-up:not([disabled]),
.tabbrowser-arrowscrollbox > .scrollbutton-down:not([disabled]) {
  border-width: 0 2px 0 0;
  border-style: solid;
  border-image: url("chrome://browser/skin/tabbrowser/tab-overflow-border.png") 0 2 0 2 fill;
}

.tabs-newtab-button > .toolbarbutton-icon {
  margin-top: -1px;
  margin-bottom: -1px;
}

.tabs-newtab-button,
#TabsToolbar > #new-tab-button,
#TabsToolbar > toolbarpaletteitem > #new-tab-button {
  list-style-image: url(chrome://browser/skin/tabbrowser/newtab.png);
  -moz-image-region: auto;
}

%ifdef WINDOWS_AERO
#TabsToolbar > #new-tab-button:-moz-system-metric(windows-compositor):not(:-moz-lwtheme),
#TabsToolbar > toolbarpaletteitem > #new-tab-button:-moz-system-metric(windows-compositor):not(:-moz-lwtheme) {
  list-style-image: url(chrome://browser/skin/tabbrowser/newtab-glass.png);
}
%endif

.tabs-newtab-button:-moz-lwtheme-brighttext,
#TabsToolbar[brighttext] > #new-tab-button,
#TabsToolbar[brighttext] > toolbarpaletteitem > #new-tab-button {
  list-style-image: url(chrome://browser/skin/tabbrowser/newtab-inverted.png);
}

.tabs-newtab-button {
/* The button has a transparent outer border, so it will appear
   to be 2px narrower than the width we set for it here */
  width: 30px;
}

#TabsToolbar > #new-tab-button {
  width: 26px;
}

#alltabs-button {
  list-style-image: url("chrome://browser/skin/tabbrowser/alltabs.png");
  -moz-image-region: rect(0, 14px, 16px, 0);
}

#alltabs-button[type="menu"] {
  list-style-image: url("chrome://browser/skin/toolbarbutton-dropdown-arrow.png");
  -moz-image-region: auto;
}

toolbar[brighttext] #alltabs-button {
  list-style-image: url("chrome://browser/skin/tabbrowser/alltabs-inverted.png");
}

%ifdef WINDOWS_AERO
:-moz-any(#TabsToolbar, #nav-bar[tabsontop=false], #toolbar-menubar) > #alltabs-button[type=menu]:-moz-system-metric(windows-compositor):not(:-moz-lwtheme),
:-moz-any(#TabsToolbar, #nav-bar[tabsontop=false], #toolbar-menubar) > toolbarpaletteitem > #alltabs-button[type=menu]:-moz-system-metric(windows-compositor):not(:-moz-lwtheme),
%endif
toolbar[brighttext] #alltabs-button[type="menu"] {
  list-style-image: url("chrome://browser/skin/toolbarbutton-dropdown-arrow-inverted.png");
}

#alltabs-button[type="menu"] > .toolbarbutton-icon {
  margin: 0 2px;
}

#alltabs-button[type="menu"] > .toolbarbutton-menu-dropmarker {
  display: none;
}

/* All tabs menupopup */
.alltabs-item > .menu-iconic-left > .menu-iconic-icon {
  list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
}

.alltabs-item[selected="true"] {
  font-weight: bold; 
}

.alltabs-item[busy] > .menu-iconic-left > .menu-iconic-icon {
  list-style-image: url("chrome://global/skin/icons/loading_16.png");
}

.alltabs-item[tabIsVisible] {
  /* box-shadow instead of background-color to work around native styling */
  box-shadow: inset -5px 0 ThreeDShadow;
}

/* Tabstrip close button */
.tabs-closebutton {
  -moz-appearance: none;
  padding: 4px 2px;
  margin: 0px;
  border: none;
}

toolbar[brighttext] .tabs-closebutton {
  list-style-image: url("chrome://global/skin/icons/close-inverted.png");
}

.tabs-closebutton > .toolbarbutton-icon {
  -moz-margin-end: 0px !important;
  -moz-padding-end: 2px !important;
  -moz-padding-start: 2px !important;
}

toolbarbutton.chevron {
  list-style-image: url("chrome://global/skin/toolbar/chevron.gif") !important;
}

toolbarbutton.chevron:-moz-locale-dir(rtl) > .toolbarbutton-icon {
  transform: scaleX(-1);
}

toolbarbutton.chevron > .toolbarbutton-text,
toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
  display: none;
}

toolbarbutton.chevron > .toolbarbutton-icon {
  margin: 0;
}

toolbar[mode="text"] toolbarbutton.chevron > .toolbarbutton-icon {
  display: -moz-box; /* display chevron icon in text mode */
}

#sidebar-throbber[loading="true"] {
  list-style-image: url("chrome://global/skin/icons/loading_16.png");
  -moz-margin-end: 4px;
}

/* Pale Moon: Feed icon */
#ub-feed-button,
#ub-feed-button > .button-box,
#ub-feed-button:hover:active > .button-box {
  padding: 0px;
  margin: 0px;
  border: 0px; 
  background-color: transparent !important;
}

#ub-feed-button {
  -moz-appearance: none; 
  min-width: 0px; 
  list-style-image: url("chrome://browser/skin/feeds/feed-icons-16.png");
  -moz-image-region: rect(0px 16px 16px 0px);
}

#ub-feed-button:hover {
  -moz-image-region: rect(0px 32px 16px 16px);
}

#ub-feed-button[open="true"],
#ub-feed-button:hover:active {
  -moz-image-region: rect(0px 48px 16px 32px);
}


/* Bookmarks toolbar */
#PlacesToolbarDropIndicator {
  list-style-image: url(chrome://browser/skin/places/toolbarDropMarker.png);
}

toolbarbutton.bookmark-item[dragover="true"][open="true"] {
  -moz-appearance: none;
  background: Highlight !important;
  color: HighlightText !important;
}

/* rules for menupopup drop indicators */
.menupopup-drop-indicator-bar {
  position: relative;
  /* these two margins must together compensate the indicator's height */
  margin-top: -1px;
  margin-bottom: -1px;
}

.menupopup-drop-indicator {
  list-style-image: none;
  height: 2px;
  -moz-margin-end: -4em;
  background-color: Highlight;
}

/* ::::: Identity Indicator Styling ::::: */

/* Popup Icons */
#identity-popup-icon {
  height: 64px;
  width: 64px;
  padding: 0;
  list-style-image: url("chrome://browser/skin/identity.png");
  -moz-image-region: rect(0px, 64px, 64px, 0px);
}

#identity-popup.verifiedDomain > #identity-popup-container > #identity-popup-icon {
  -moz-image-region: rect(64px, 64px, 128px, 0px);
}

#identity-popup.verifiedIdentity > #identity-popup-container > #identity-popup-icon {
  -moz-image-region: rect(128px, 64px, 192px, 0px);
}

/* Popup Body Text */
.identity-popup-description {
  white-space: pre-wrap;
  -moz-padding-start: 15px;
  margin: 2px 0 4px;
}

.identity-popup-label {
  white-space: pre-wrap;
  -moz-padding-start: 15px;
  margin: 0;
}

#identity-popup-content-host,
#identity-popup-content-box.verifiedIdentity > #identity-popup-content-owner {
  font-size: 1.2em;
}

#identity-popup-content-host {
  margin-top: 3px;
  margin-bottom: 5px;
  font-weight: bold;
  max-width: 300px;
}

#identity-popup-content-owner {
  margin-top: 4px;
  margin-bottom: 0 !important;
  font-weight: bold;
  max-width: 300px;
}

.verifiedDomain > #identity-popup-content-owner {
  font-weight: normal;
}

#identity-popup-content-verifier {
  margin: 4px 0 2px;
}

#identity-popup-content-box.verifiedIdentity > #identity-popup-encryption ,
#identity-popup-content-box.verifiedDomain > #identity-popup-encryption {
  margin-top: 10px;
  -moz-margin-start: -24px;
}

#identity-popup-content-box.verifiedIdentity > #identity-popup-encryption > vbox > #identity-popup-encryption-icon ,
#identity-popup-content-box.verifiedDomain > #identity-popup-encryption > vbox > #identity-popup-encryption-icon {
  list-style-image: url("chrome://browser/skin/Secure24.png");
}

#identity-popup-more-info-button {
  margin-top: 6px;
  margin-bottom: 0;
  -moz-margin-end: 0;
}

.popup-notification-icon {
  width: 64px;
  height: 64px;
  -moz-margin-end: 10px;
}

.popup-notification-icon[popupid="geolocation"] {
  list-style-image: url(chrome://browser/skin/Geolocation-64.png);
}

.popup-notification-icon[popupid="xpinstall-disabled"],
.popup-notification-icon[popupid="addon-progress"],
.popup-notification-icon[popupid="addon-install-cancelled"],
.popup-notification-icon[popupid="addon-install-blocked"],
.popup-notification-icon[popupid="addon-install-failed"],
.popup-notification-icon[popupid="addon-install-complete"] {
  list-style-image: url(chrome://mozapps/skin/extensions/extensionGeneric.png);
  width: 32px;
  height: 32px;
}

.popup-notification-icon[popupid="click-to-play-plugins"] {
  list-style-image: url(chrome://mozapps/skin/plugins/pluginBlocked-64.png);
}

.popup-notification-icon[popupid="web-notifications"] {
  list-style-image: url(chrome://browser/skin/notification-64.png);
}

.addon-progress-description {
  width: 350px;
  max-width: 350px;
}

.popup-progress-label,
.popup-progress-meter {
  -moz-margin-start: 0;
  -moz-margin-end: 0;
}

.popup-progress-cancel {
  -moz-appearance: none;
  background: transparent;
  border: none;
  padding: 0;
  margin: 0;
  min-height: 0;
  min-width: 0;
  list-style-image: url(chrome://mozapps/skin/downloads/downloadButtons.png);
  -moz-image-region: rect(0px, 32px, 16px, 16px);
}

.popup-progress-cancel:hover {
  -moz-image-region: rect(16px, 32px, 32px, 16px);
}

.popup-progress-cancel:active {
  -moz-image-region: rect(32px, 32px, 48px, 16px);
}

.popup-notification-icon[popupid="indexedDB-permissions-prompt"],
.popup-notification-icon[popupid="indexedDB-quota-prompt"],
.popup-notification-icon[popupid*="offline-app-requested"],
.popup-notification-icon[popupid="offline-app-usage"] {
  list-style-image: url(chrome://global/skin/icons/question-64.png);
}

.popup-notification-icon[popupid="password-save"],
.popup-notification-icon[popupid="password-change"] {
  list-style-image: url(chrome://mozapps/skin/passwordmgr/key-64.png);
}

.popup-notification-icon[popupid="webapps-install"] {
  list-style-image: url(chrome://browser/skin/webapps-64.png);
}

.popup-notification-icon[popupid="mixed-content-blocked"] {
  list-style-image: url(chrome://browser/skin/mixed-content-blocked-64.png);
}

.popup-notification-icon[popupid="webRTC-sharingDevices"],
.popup-notification-icon[popupid="webRTC-shareDevices"] {
  list-style-image: url(chrome://browser/skin/webRTC-shareDevice-64.png);
}

.popup-notification-icon[popupid="pointerLock"] {
  list-style-image: url(chrome://browser/skin/pointerLock-64.png);
}

/* Notification icon box */
#notification-popup-box {
  position: relative;
  background-color: #fff;
  background-clip: padding-box;
  padding-left: 3px;
  border-radius: 2.5px 0 0 2.5px;
  border-width: 0 8px 0 0;
  border-style: solid;
  border-image: url("chrome://browser/skin/urlbar-arrow.png") 0 8 0 0 fill;
  -moz-margin-end: -8px;
}

@conditionalForwardWithUrlbar@[forwarddisabled] + #urlbar-container > #urlbar > #notification-popup-box {
  padding-left: 5px;
}

#notification-popup-box:-moz-locale-dir(rtl),
.notification-anchor-icon:-moz-locale-dir(rtl) {
  transform: scaleX(-1);
}

.notification-anchor-icon {
  width: 16px;
  height: 16px;
  margin: 0 2px;
}

.notification-anchor-icon:-moz-focusring {
  outline: 1px dotted -moz-DialogText;
  outline-offset: -3px;
}

.default-notification-icon,
#default-notification-icon {
  list-style-image: url(chrome://global/skin/icons/information-16.png);
}

.geo-notification-icon,
#geo-notification-icon {
  list-style-image: url(chrome://browser/skin/Geolocation-16.png);
}

#addons-notification-icon {
  list-style-image: url(chrome://mozapps/skin/extensions/extensionGeneric-16.png);
}

.indexedDB-notification-icon,
#indexedDB-notification-icon {
  list-style-image: url(chrome://global/skin/icons/question-16.png);
}

#password-notification-icon {
  list-style-image: url(chrome://mozapps/skin/passwordmgr/key-16.png);
}

#webapps-notification-icon {
  list-style-image: url(chrome://browser/skin/webapps-16.png);
}

#plugins-notification-icon {
  list-style-image: url(chrome://browser/skin/notification-pluginNormal.png);
}

#alert-plugins-notification-icon {
  list-style-image: url(chrome://browser/skin/notification-pluginAlert.png);
}

#blocked-plugins-notification-icon {
  list-style-image: url(chrome://browser/skin/notification-pluginBlocked.png);
}

#plugins-notification-icon,
#alert-plugins-notification-icon,
#blocked-plugins-notification-icon {
  -moz-image-region: rect(0, 16px, 16px, 0);
}

#plugins-notification-icon:hover,
#alert-plugins-notification-icon:hover,
#blocked-plugins-notification-icon:hover {
  -moz-image-region: rect(0, 32px, 16px, 16px);
}

#plugins-notification-icon:active,
#alert-plugins-notification-icon:active,
#blocked-plugins-notification-icon:active {
  -moz-image-region: rect(0, 48px, 16px, 32px);
}

#notification-popup-box[hidden] {
  /* Override display:none to make the pluginBlockedNotification animation work
     when showing the notification repeatedly. */
  display: -moz-box;
  visibility: collapse;
}

#blocked-plugins-notification-icon[showing] {
  animation: pluginBlockedNotification 500ms ease 0s 5 alternate both;
}

@keyframes pluginBlockedNotification {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.mixed-content-blocked-notification-icon,
#mixed-content-blocked-notification-icon {
  list-style-image: url(chrome://browser/skin/mixed-content-blocked-16.png);
}

.webRTC-shareDevices-notification-icon,
#webRTC-shareDevices-notification-icon {
  list-style-image: url(chrome://browser/skin/webRTC-shareDevice-16.png);
}

.webRTC-sharingDevices-notification-icon,
#webRTC-sharingDevices-notification-icon {
  list-style-image: url(chrome://browser/skin/webRTC-sharingDevice-16.png);
}

.web-notifications-notification-icon,
#web-notifications-notification-icon {
  list-style-image: url(chrome://browser/skin/notification-16.png);
}

#pointerLock-notification-icon {
  list-style-image: url(chrome://browser/skin/pointerLock-16.png);
}
#pointerLock-cancel {
  margin: 0px;
}

#identity-popup-container {
  min-width: 280px;
}

/* Bookmarks roots menu-items */
#appmenu_subscribeToPage:not([disabled]),
#appmenu_subscribeToPageMenu,
#subscribeToPageMenuitem:not([disabled]),
#subscribeToPageMenupopup,
#BMB_subscribeToPageMenuitem:not([disabled]),
#BMB_subscribeToPageMenupopup {
  list-style-image: url("chrome://browser/skin/feeds/feedIcon16.png");
}

#appmenu_bookmarksToolbar,
#bookmarksToolbarFolderMenu,
#BMB_bookmarksToolbar {
  list-style-image: url("chrome://browser/skin/places/bookmarksToolbar.png");
  -moz-image-region: auto;
}

#appmenu_unsortedBookmarks,
#menu_unsortedBookmarks,
#BMB_unsortedBookmarks {
  list-style-image: url("chrome://browser/skin/places/unsortedBookmarks.png");
  -moz-image-region: auto;
}

/* ::::: Keyboard UI Panel ::::: */

.KUI-panel {
  -moz-appearance: none;
  background: rgba(27%,27%,27%,.9) url(KUI-background.png) repeat-x;
  color: white;
  border-style: none;
  border-radius: 20px;
}

.KUI-panel[level="top"] {
  background-color: rgba(27%,27%,27%,.65);
}

.KUI-panel-closebutton {
  list-style-image: url(KUI-close.png);
  -moz-appearance: none;
  border: none;
  padding: 0;
  width: 24px;
  height: 24px;
}

.KUI-panel-closebutton:not(:hover) {
  opacity: .6;
}

.KUI-panel-closebutton > .toolbarbutton-icon {
  margin: 0;
}

/* ::::: Ctrl-Tab and All Tabs Panels ::::: */

/* Ctrl-Tab */

#ctrlTab-panel {
  padding: 20px 10px 10px;
  font-weight: bold;
  text-shadow: 0 0 1px rgb(27%,27%,27%), 0 0 2px rgb(27%,27%,27%);
}

.ctrlTab-favicon[src] {
  background-color: white;
  width: 20px;
  height: 20px;
  padding: 2px;
}

.ctrlTab-preview-inner > .tabPreview-canvas {
  box-shadow: 1px 1px 2px rgb(12%,12%,12%);
}

.ctrlTab-preview:not(#ctrlTab-showAll) > * > .ctrlTab-preview-inner > .tabPreview-canvas {
  margin-bottom: 2px;
}

.ctrlTab-preview-inner {
  padding-bottom: 10px;
}

#ctrlTab-showAll:not(:focus) > * > .ctrlTab-preview-inner {
  padding: 10px;
  background-color: rgba(255,255,255,.2);
  border-radius: .5em;
}

.ctrlTab-preview:focus > * > .ctrlTab-preview-inner {
  color: white;
  background-color: rgba(0,0,0,.6);
  text-shadow: none;
  padding: 8px;
  border: 2px solid white;
  border-radius: .5em;
}

.ctrlTab-preview:not(#ctrlTab-showAll):focus > * > .ctrlTab-preview-inner {
  margin: -10px -10px 0;
}

#ctrlTab-showAll {
  margin-top: .5em;
}

/* All Tabs */

#allTabs-panel {
  padding-bottom: 10px;
  -moz-appearance: none;
  border: none;
  background: -moz-dialog;
  color: -moz-dialogText;
}

#allTabs-meta {
  margin: 10px;
}

#allTabs-filter {
  -moz-margin-start: 24px;
  -moz-margin-end: 0;
}

#allTabs-tab-close-button > .toolbarbutton-icon {
  margin: 0;
}

/* Make sure the allTab previews always have regular close buttons */
#allTabs-tab-close-button:-moz-lwtheme-brighttext {
  list-style-image: url("chrome://global/skin/icons/close.png");
}

.allTabs-favicon[src] {
  background-color: -moz-dialog;
  width: 22px;
  height: 22px;
  padding-top: 1px;
  padding-bottom: 5px;
  -moz-padding-start: 1px;
  -moz-padding-end: 5px;
  margin-top: -2px;
  -moz-margin-start: -2px;
  border-bottom-right-radius: 4px;
}

.allTabs-favicon[src]:-moz-locale-dir(rtl) {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 4px;
}

.allTabs-preview-inner > .tabPreview-canvas {
  background-color: rgb(60%,60%,60%);
  box-shadow: 0 0 1.5px ThreeDShadow;
}

.allTabs-preview:not(:hover):not([closebuttonhover]) > html|canvas {
  opacity: .8;
}

.allTabs-preview:focus > * > .allTabs-preview-inner {
  outline: 1px dotted -moz-dialogText;
}

/* Add-on bar */

#addon-bar {
  -moz-appearance: none;
  min-height: 20px;
  border-top-style: none;
  border-bottom-style: none;
  padding-top: 1px;
  background-image: linear-gradient(rgba(0,0,0,.15) 1px, rgba(255,255,255,.15) 1px);
  background-size: 100% 2px;
  background-repeat: no-repeat;
}

#status-bar {
  -moz-appearance: none;
  background-color: transparent;
  border: none;
  min-height: 0;
}

#addon-bar[customizing] > #status-bar {
  opacity: .5;
  background-image: repeating-linear-gradient(135deg,
                                              rgba(255,255,255,.3), rgba(255,255,255,.3) 5px,
                                              rgba(0,0,0,.3) 5px, rgba(0,0,0,.3) 10px);
}

#status-bar > statusbarpanel {
  border-width: 0;
  -moz-appearance: none;
}

#addonbar-closebutton {
  border: none;
  padding: 0 5px;
  -moz-appearance: none;
}

toolbar[brighttext] #addonbar-closebutton {
  list-style-image: url("chrome://global/skin/icons/close-inverted.png");
}

/* Status panel */

.statuspanel-label {
  margin: 0;
  padding: 2px 4px;
  background: linear-gradient(#fff, #ddd);
  border: 1px none #ccc;
  border-top-style: solid;
  color: #333;
  text-shadow: none;
}

.statuspanel-label:-moz-locale-dir(ltr):not([mirror]),
.statuspanel-label:-moz-locale-dir(rtl)[mirror] {
  border-right-style: solid;
  /* disabled for triggering grayscale AA (bug 659213)
  border-top-right-radius: .3em;
  */
  margin-right: 1em;
}

.statuspanel-label:-moz-locale-dir(rtl):not([mirror]),
.statuspanel-label:-moz-locale-dir(ltr)[mirror] {
  border-left-style: solid;
  /* disabled for triggering grayscale AA (bug 659213)
  border-top-left-radius: .3em;
  */
  margin-left: 1em;
}

#full-screen-warning-message {
  background-color: hsl(0,0%,15%);
  color: white;
  border-radius: 8px;
  margin-top: 30px;
  padding: 30px 50px;
  box-shadow: 0 0 2px white;
}

#full-screen-warning-container[obscure-browser] {
  background-color: rgba(0,0,0,0.3);
}

.full-screen-description {
  font-size: 150%;
}

#full-screen-domain-text {
  font-size: 300%;
}

.full-screen-approval-button,
#full-screen-remember-decision {
  font-size: 120%;
}

%ifdef MOZ_DEVTOOLS
%include ../shared/devtools/responsivedesign.inc.css
%include ../shared/devtools/highlighter.inc.css
%include ../shared/devtools/commandline.inc.css
%endif
%include ../shared/plugin-doorhanger.inc.css

%ifdef MOZ_DEVTOOLS
/* Error counter */

#developer-toolbar-toolbox-button[error-count]:before {
  color: #FDF3DE;
  min-width: 16px;
  text-shadow: none;
  background-image: linear-gradient(#B4211B, #8A1915);
  border-radius: 1px;
  -moz-margin-end: 5px;
}
%endif

.toolbarbutton-badge-container {
  margin: 0;
  padding: 0;
  position: relative;
}

@navbarLargeIcons@ .toolbarbutton-1 > .toolbarbutton-badge-container {
  padding: 2px 5px;
}

.toolbarbutton-1 > .toolbarbutton-badge-container > .toolbar-icon {
  position: absolute;
  top: 2px;
  right: 2px;
}

.toolbarbutton-badge-container > .toolbarbutton-icon[label]:not([label=""]) {
  -moz-margin-end: 0;
}

.toolbarbutton-badge[badge=""] {
  display: none;
}
.toolbarbutton-badge[badge]:not([badge=""])::after {
  /* The |content| property is set in the content stylesheet. */
  font-size: 9px;
  font-weight: bold;
  padding: 0 1px;
  color: #fff;
  background-color: rgb(240,61,37);
  border: 1px solid rgb(216,55,34);
  border-radius: 2px;
  box-shadow: 0 1px 0 rgba(0,39,121,0.77);
  position: absolute;
  top: 0;
  right: 0;
}

@navbarLargeIcons@ *|* > .toolbarbutton-badge[badge]:not([badge=""])::after {
  top: 1px;
  right: 1px;
}

.toolbarbutton-badge[badge]:not([badge=""]):-moz-locale-dir(rtl)::after {
  left: 0;
  right: auto;
}

@navbarLargeIcons@ *|* > .toolbarbutton-badge[badge]:not([badge=""]):-moz-locale-dir(rtl)::after {
  left: 1px;
  right: auto;
}

#main-window[privatebrowsingmode=temporary] #toolbar-menubar {
  background-image: url("chrome://browser/skin/privatebrowsing-dark.png");
  background-position: top right;
  background-repeat: no-repeat;
}

#main-window[privatebrowsingmode=temporary] #toolbar-menubar:-moz-locale-dir(rtl) {
  background-position: top left;
}

#main-window[privatebrowsingmode=temporary] #appmenu-button > .button-box > .box-inherit > .button-icon {
  list-style-image: url("chrome://browser/skin/privatebrowsing-light.png");
  width: 20px;
  height: 16px;
}
