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

/**************************** Tab Container ***************************/
#TabsToolbar {
  box-shadow: inset 0 -5px rgba(0,0,0,0.01),
              inset 0 -4px rgba(0,0,0,0.012),
              inset 0 -3px rgba(0,0,0,0.015), 
              inset 0 -2px rgba(0,0,0,0.018), 
              inset 0 -1px rgba(0,0,0,0.025) !important;
  background: -moz-linear-gradient(#F5F5F7, #e5e6e9) !important;
}

#main-window[htitlemode] #TabsToolbar {
  box-shadow: inset 0 -5px rgba(0,0,0,0.01),
              inset 0 -4px rgba(0,0,0,0.012),
              inset 0 -3px rgba(0,0,0,0.015), 
              inset 0 -2px rgba(0,0,0,0.018), 
              inset 0 -1px rgba(0,0,0,0.025),
              inset 0  1px rgba(255,255,255,1) !important;
  background: -moz-linear-gradient(#F5F5F7, #e5e6e9) !important;
}

#private-browsing-indicator {
  background:  url("images/privatebrowsing-mask.png"),
              -moz-linear-gradient(#F5F5F7, #e5e6e9) !important;
  box-shadow: inset 0 -5px rgba(0,0,0,0.01),
              inset 0 -4px rgba(0,0,0,0.012),
              inset 0 -3px rgba(0,0,0,0.015), 
              inset 0 -2px rgba(0,0,0,0.018), 
              inset 0 -1px rgba(0,0,0,0.025) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

.toolbar-primary {
  background-color: #F5F5F7 !important;
}

.tabs-newtab-button > .toolbarbutton-icon,
#new-tab-button > .toolbarbutton-icon {
  -moz-appearance: none !important;
  list-style-image: url("images/new-tab.png") !important;
  -moz-image-region: auto !important;
}

#TabsToolbar .toolbarbutton-1,
#TabsToolbar .toolbarbutton-1 > .toolbarbutton-menubutton-button {
  -moz-appearance: none !important;
  border-style: none !important;
  padding: 0 3px !important;
}

/**************************** Search Icon ****************************/
.search-go-button {
  -moz-appearance: none !important;
  list-style-image: url("images/search.png") !important;
  -moz-image-region: auto !important;
}

/**************************** Tab-throbber ***************************/

.tab-throbber {
  list-style-image: url("images/connecting.png") !important;
}

.tab-throbber[progress] {
  list-style-image: url("images/loading.png") !important;
}

/**************************** Bookmarks Bar ***************************/

#navigator-toolbox #PersonalToolbar {
  background: #DDDEE0 !important;
  background-image: none !important;
  padding: 3px !important;
  padding-top: 2px !important;
  box-shadow: inset 0 1px #b9b9b9,
              inset 0 2px rgba(255,255,255,0.5) !important;
}

#navigator-toolbox:after {
  background-color: #b9b9b9 !important;
}

/**************************** Navbar ***************************/
#nav-bar {
  -moz-appearance: none !important;
  border-top: none !important;
  box-shadow: inset 0 1px #b9b9b9,
              inset 0 2px rgba(255,255,255,1.0) !important;

  background: -moz-linear-gradient(#EFF0F1, #DDDEE0) !important;
  color: #3c3c3c !important;
}

/* Replace the default close tab icon with a white one */
.tab-close-button[selected="true"],
.tab-close-button:active {
    list-style-image: url("images/tab-close-selected.svg") !important;
}

.tabbrowser-tab:not([selected="true"]) .tab-close-button:hover,
.tab-close-button:hover {
    list-style-image: url("images/tab-close-hover.svg") !important;
}

.tab-close-button {
    list-style-image: url("images/tab-close.svg") !important;
}

/*Selected tab background */
.tabbrowser-tab[selected="true"],
.tabbrowser-tab[selected="true"]:hover,
.tabbrowser-tab:not([selected="true"]):hover {
  background-color: rgba(0,0,0,0) !important;
  color: #3c3c3c !important;
  text-shadow: 0 1px rgba(255,255,255,0.95) !important;
}

.tabbrowser-tab:not([selected="true"]) {
  background-color: rgba(0,0,0,0) !important;
  color: #818182 !important;
  text-shadow: 0 1px rgba(255,255,255,0.95) !important;
}

.tab-background-middle[selected="true"] {
  background-color: rgba(0,0,0,0) !important;
}

.tab-background-start[selected=true]:-moz-locale-dir(ltr):not(:-moz-lwtheme)::before,
.tab-background-end[selected=true]:-moz-locale-dir(rtl):not(:-moz-lwtheme)::before {
  background-image: url("images/tabActiveStart.svg") !important;
}

.tab-background-end[selected=true]:-moz-locale-dir(ltr):not(:-moz-lwtheme)::before,
.tab-background-start[selected=true]:-moz-locale-dir(rtl):not(:-moz-lwtheme)::before {
  background-image: url("images/tabActiveEnd.svg") !important;
}

.tab-background-middle[selected=true] {
  background-image: url("images/tabActiveMiddle.svg") !important;
}

.tab-background-start[selected=true]:-moz-locale-dir(ltr)::after,
.tab-background-end[selected=true]:-moz-locale-dir(rtl)::after {
  background-image: none !important;
}

.tab-background-end[selected=true]:-moz-locale-dir(ltr)::after,
.tab-background-start[selected=true]:-moz-locale-dir(rtl)::after {
  background-image: none !important;
}

.tab-background-middle::after[selected=true] {
  background-image: none !important;
}

/* Background tab separators (2px wide).
   Also show separators beside the selected tab when dragging it. */
#tabbrowser-tabs[movingtab] > .tabbrowser-tab[beforeselected]:not([last-visible-tab])::after,
.tabbrowser-tab:not([selected]):not([afterselected-visible]):not([afterhovered]):not([first-visible-tab]):not(:hover)::before,
#tabbrowser-tabs:not([overflow]) > .tabbrowser-tab[last-visible-tab]:not([selected]):not([beforehovered]):not(:hover)::after {
  -moz-margin-start: -1px !important;
  -moz-margin-end: -1px !important;
  background-image: url(images/tab-separator.svg) !important;
  background-position: left bottom 1px !important;
  background-repeat: no-repeat !important;
  background-size: 2px 100% !important;
  content: "" !important;
  display: -moz-box !important;
  width: 2px !important;
}

/* new tab button border and gradient on hover */
.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true]),
.tabs-newtab-button:hover {
  background-image: url(images/tab-start-hover.svg),
                    url(images/tab-middle-hover.svg),
                    url(images/tab-end-hover.svg) !important;
  background-position: left bottom, 30px bottom, right bottom !important;
  background-repeat: no-repeat !important;
  background-size: 30px 100%, calc(100% - (2 * 30px)) 100%, 30px 100% !important;
}

/************************* Text Input Boxes ***************************/
#identity-box {
  background-color: transparent !important;
}

.searchbar-textbox {
  padding: 2px !important;
}

#nav-bar textbox {
  -moz-appearance: none !important;
  color: #3c3c3c !important;
  background-color: #ffffff !important;
  border-radius: 2px !important;
  border: 1px solid #BABABC !important;
  border-top-color: #8d8d8f !important;
  border-bottom-color: #CECED0 !important;
  transition: none !important;
  box-shadow: 0 1px rgba(255,255,255,0.75),
              inset 0 1px rgba(0,0,0,0.1) !important;
}

#nav-bar textbox[focused="true"] {
  -moz-appearance: none !important;
  color: #3c3c3c !important;
  background-color: #ffffff !important;
  border-radius: 2px !important;
  border: 1px solid rgba(64,128,251,210) !important;
  transition: none !important;
  box-shadow: 0 1px rgba(255,255,255,0.75),
              inset 0 1px #D5E0F6,
              inset 0 -1px #D5E0F6,
              inset 1px 0 #D5E0F6,
              inset -1px 0 #D5E0F6 !important;
}

#nav-bar textbox[disabled="true"] {
  -moz-appearance: none !important;
  color: #7F7F8A !important;
  background-color: #F4F4F4 !important;
  border-radius: 2px !important;
  border: 1px solid #171717 !important;
  border-top-color: #0f0f0f !important;
  transition: none !important;
  box-shadow: 0 1px rgba(255,255,255,0.75) !important;
}

/* Places toolbar *//* ::::: bookmark buttons ::::: */

#personal-bookmarks {
  min-height: 18px !important;
}

toolbarbutton.bookmark-item {
  -moz-appearance: none !important;
  background: none !important;
  border: 1px solid rgba(0,0,0,.0) !important;
  border-radius: 2px !important;
  padding: 4px !important;
  color: #3c3c3c !important;
  text-shadow: 0 1px rgba(255,255,255,0.95) !important;
  box-shadow: none !important;
}

/* separator (between navbar menubuttons with dropmarker) colors */
#nav-bar .toolbarbutton-1:not(:hover):not(:active):not([open]) > .toolbarbutton-menubutton-dropmarker::before,
#nav-bar .toolbarbutton-1:active > .toolbarbutton-menubutton-dropmarker::before,
#nav-bar .toolbaritem-combined-buttons > .toolbarbutton-1:-moz-any(:not(:hover):not([open]),[disabled]) + .toolbarbutton-1:-moz-any(:not(:hover):not([open]),[disabled])::before{
  width: 2px !important;
  height: 18px !important;
  background: none !important;
  border-image: url("images/navbar-separator.png") 0 0 0 2 / 0 0 0 2px !important;
  margin-left: -1px !important;
}

#PanelUI-button {
  background: none !important;
  border-image: url("images/navbar-separator.png") 0 0 0 2 / 0 0 0 2px !important;
}

/*hover*/
#TabsToolbar .toolbarbutton-1:not([disabled]):hover > .toolbarbutton-icon,
#TabsToolbar .toolbarbutton-1 > .toolbarbutton-menubutton-button:not([disabled]):hover > .toolbarbutton-icon,
#nav-bar #forward-button:hover > .toolbarbutton-icon,
toolbarbutton.bookmark-item:hover,
#nav-bar .toolbarbutton-1:not([disabled]):-moz-any(:hover,[open]) > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
#nav-bar .toolbarbutton-1:not([disabled]):hover > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon,
#nav-bar .toolbarbutton-1:not([disabled]):not([checked]):not([open]):not(:active):hover > .toolbarbutton-icon,
#nav-bar .toolbarbutton-1:not([disabled]):not([checked]):not([open]):not(:active):hover > .toolbarbutton-text,
#nav-bar .toolbarbutton-1:not([disabled]):not([checked]):not([open]):not(:active):hover > .toolbarbutton-badge-container {
  background-color: rgba(0,0,0,0) !important;
  border-color: #b5b5b5 !important;
  border-bottom-color: #878788 !important;
  background-image: linear-gradient(to bottom,
                                      #ffffff,
                                      #e6e6e6
                                      ) !important;
  background-clip: padding-box !important;
  transition: none !important;
  box-shadow: 0 1px rgba(0,0,0,0.1),
              inset 0 1px rgba(255,255,255,1.0) !important;
  color: #3c3c3c !important;
  text-shadow: 0 1px rgba(255,255,255,0.95) !important;
}

#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button:not([disabled]):not([open]):not(:active):hover > .toolbarbutton-icon,
#nav-bar .toolbarbutton-1:not([buttonover]):not([open]):not(:active):hover > .toolbarbutton-menubutton-dropmarker:not([disabled]) > .dropmarker-icon {
  background-color: rgba(0,0,0,0) !important;
  border-color: #b5b5b5 !important;
  border-bottom-color: #878788 !important;
  background-image: linear-gradient(to bottom,
                                      #ffffff,
                                      #F2F2F2
                                      ) !important;
  background-clip: padding-box !important;
  transition: none !important;
  box-shadow: 0 1px rgba(0,0,0,0.1),
              inset 0 1px rgba(255,255,255,1.0) !important;
  color: #3c3c3c !important;
  text-shadow: 0 1px rgba(255,255,255,0.95) !important;
}

/*active*/
#nav-bar .toolbarbutton-1[checked]:not(:active):hover > .toolbarbutton-icon,
#TabsToolbar .toolbarbutton-1:not([disabled]):-moz-any([open],[checked],:hover:active) > .toolbarbutton-icon,
#TabsToolbar .toolbarbutton-1 > .toolbarbutton-menubutton-button:not([disabled]):-moz-any([open],[checked],:hover:active) > .toolbarbutton-icon,
#nav-bar #forward-button:not([disabled]):-moz-any([open],[checked],:hover:active) > .toolbarbutton-icon,
toolbarbutton.bookmark-item:hover:active:not([disabled="true"]),
toolbarbutton.bookmark-item[open="true"],
#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button:not([disabled]):hover:active > .toolbarbutton-icon,
#nav-bar .toolbarbutton-1[open] > .toolbarbutton-menubutton-dropmarker:not([disabled]) > .dropmarker-icon,
#nav-bar .toolbarbutton-1:not([disabled]):-moz-any([open],[checked],:hover:active) > .toolbarbutton-icon,
#nav-bar .toolbarbutton-1:not([disabled]):-moz-any([open],[checked],:hover:active) > .toolbarbutton-text,
#nav-bar .toolbarbutton-1:not([disabled]):-moz-any([open],[checked],:hover:active) > .toolbarbutton-badge-container {
  background-color: rgba(0,0,0,0) !important;
  border: 1px solid #828284 !important;
  border-top-color: #3f4042 !important;
  background-image: linear-gradient(to bottom,
                                      #6a6a6c,
                                      #949596
                                      ) !important;
  background-clip: padding-box !important;
  transition: none !important;
  box-shadow: 0 1px rgba(255,255,255,0.75),
              inset 0 1px 2px rgba(0,0,0,0.2) !important;
  color: #ffffff !important;
  text-shadow: 0 -1px rgba(0,0,0,0.5) !important;
}

/*back-button*/
window:not([chromehidden~="toolbar"]) #urlbar-container > #back-button:not([open]):not(:active):not([disabled]) > .toolbarbutton-icon {
  border: 1px solid #ABABAB !important;
  border-left-color: #939394 !important;
  border-right-color: #939394 !important;
  border-bottom-color: #878788 !important;
  background-image: linear-gradient(to bottom,
                                      #F4F4F4,
                                      #E2E3E5
                                      ) !important;
  box-shadow: 0 1px rgba(0,0,0,0.1),
              inset 0 1px rgba(255,255,255,1.0) !important;
  margin-right: -3px !important;
  color: #3c3c3c !important;
  list-style-image: url("images/back.png") !important;
  -moz-image-region: auto !important;
}

window:not([chromehidden~="toolbar"]) #urlbar-container > #back-button:not([open]):not(:active):not([disabled]):hover > .toolbarbutton-icon {
  border: 1px solid #ABABAB !important;
  border-left-color: #939394 !important;
  border-right-color: #939394 !important;
  border-bottom-color: #878788 !important;
  background-image: linear-gradient(to bottom,
                                      #ffffff,
                                      #e6e6e6
                                      ) !important;
}

window:not([chromehidden~="toolbar"]) #urlbar-container > #back-button:not([disabled]):-moz-any([open],[checked],:hover:active) > .toolbarbutton-icon {
  border: 1px solid #505454 !important;
  margin-right: -3px !important;
  box-shadow: 0 1px rgba(255,255,255,0.75),
              inset 0 1px 2px rgba(0,0,0,0.2) !important;
  list-style-image: url("images/back.png") !important;
  -moz-image-region: auto !important;
}

window:not([chromehidden~="toolbar"]) #urlbar-container > #back-button:-moz-any([disabled],:not([open]):not([disabled]):not(:active)) > .toolbarbutton-icon {
  border: 1px solid #ABABAB !important;
  border-left-color: #939394 !important;
  border-right-color: #939394 !important;
  border-bottom-color: #878788 !important;
  background-image: none !important;
  background-color: #f4f4f4 !important;
  box-shadow: 0 1px rgba(0,0,0,0.1),
              inset 0 1px rgba(255,255,255,0.15) !important;
  margin-right: -3px !important;
  list-style-image: url("images/back-insensitive.png") !important;
  -moz-image-region: auto !important;
  opacity: 1 !important;
}

/*forward-button*/
#nav-bar #forward-button > .toolbarbutton-icon {
  border: 1px solid #b5b5b5 !important;
  border-bottom-color: #878788 !important;
  background-image: linear-gradient(to bottom,
                                      #F4F4F4,
                                      #E2E3E5
                                      ) !important;
  box-shadow: 0 1px rgba(0,0,0,0.1),
              inset 0 1px rgba(255,255,255,1.0) !important;
  margin-right: -1px !important;
  list-style-image: url("images/forward.png") !important;
  -moz-image-region: auto !important;
}

/*************************** Dropmarker *******************************/
dropmarker {
  -moz-appearance: none!important;
  width: 16px!important;
  height: 16px!important;
  -moz-box-align: center!important;
  -moz-box-pack: center!important;
  list-style-image: url("images/arrow-dn[dropmarker].png")!important;
  -moz-image-region: auto!important;
}

dropmarker:hover:active:not([disabled="true"]) {
  padding-top: 2px!important;
  padding-bottom: 0px!important;
  -moz-padding-start: 2px!important;
  -moz-padding-end: 0px!important;
}

dropmarker[disabled="true"] {
  list-style-image: url("images/arrow-dn-dis.gif") !important;
}

.searchbar-dropmarker-image {
  -moz-appearance: none!important;
  list-style-image: url("images/arrow-dn[dropmarker].png")!important;
  -moz-image-region: auto!important;
  width: 7px!important;
  height: 4px!important;
  margin: 4px !important;
  margin-left: 7px !important;
}

/*************************** Window Controls *******************************/
#close-button, #restore-button, #minimize-button {
  -moz-appearance: none !important;
  list-style-image: url("images/window_button.svg") !important;
  padding: 7px 6px 5px 6px !important;
}

#close-button:hover { list-style-image: url("images/close_prelight.svg") !important; }
#close-button:active { list-style-image: url("images/close_pressed.svg") !important; }

#restore-button:hover { list-style-image: url("images/max_prelight.svg") !important; }
#restore-button:active { list-style-image: url("images/max_pressed.svg") !important; }

#minimize-button:hover { list-style-image: url("images/min_prelight.svg") !important; }
#minimize-button:active { list-style-image: url("images/min_pressed.svg") !important; }
