/* 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/. */

/* ===== primaryToolbar.css =============================================
   == Images for the Mail primary toolbar.
   == This file is mainly about the general look-and-feel of
   == native-OS-style toolbars at the top of various windows, as well as
   == the specifically about the ones that appear on the 3-pane window and
   == the standalone message window.  The other native-OS-style toolbars
   == (addressbook and compose) are already styled elsewhere.
   ====================================================================== */

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

/* ::::: Mail Toolbars and Menubars ::::: */

.mail-toolbox,
.contentTabToolbox {
  -moz-appearance: none;
  border-bottom: 1px solid hsl(0, 0%, 60%);
  background-image: -moz-linear-gradient(rgba(255, 255, 255, 0.32),
                    rgba(255, 255, 255, 0) 19px);
}

.mail-toolbox:not(:-moz-lwtheme),
.contentTabToolbox:not(:-moz-lwtheme) {
  background-image: -moz-linear-gradient(hsl(0, 0%, 93%), hsl(0, 0%, 83%) 98%,
                    hsla(0, 0%, 100%, .15));
}

.mail-toolbox:not(:-moz-lwtheme):-moz-window-inactive,
.contentTabToolbox:not(:-moz-lwtheme):-moz-window-inactive {
  background-color: -moz-mac-chrome-inactive;
  background-image: -moz-linear-gradient(rgba(255, 255, 255, 0),
                    rgba(255, 255, 255, 0) 19px);
}

/* Inactive window state */
.mail-toolbox:-moz-window-inactive,
.contentTabToolbox:-moz-window-inactive {
  -moz-appearance: none;
  border-bottom: 1px solid rgba(0, 0, 0, 0.32);
}

.mail-toolbox:-moz-lwtheme,
.contentTabToolbox:-moz-lwtheme {
  background-image: -moz-linear-gradient(rgba(255, 255, 255, 0.5),
                    rgba(255, 255, 255, 0) 28px);
}

.mail-bar3 {
  padding: 4px 4px 0;
}

.mail-toolbox > toolbar
.contentTabToolbox > toolbar {
  -moz-appearance: none;
}

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

.toolbarbutton-1:not([type="menu-button"]),
.toolbarbutton-1 > .toolbarbutton-menubutton-button,
.toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
  height: 22px;
  padding: 0;
  border: 0;
}

.toolbarbutton-1[type="menu"] {
  -moz-binding: url("chrome://global/content/bindings/toolbarbutton.xml#menu-vertical");
}

toolbox[labelalign="end"] .toolbarbutton-1[type="menu"],
toolbox[labelalign="end"] toolbarpaletteitem .toolbarbutton-1[type="menu"] {
  -moz-binding: url("chrome://global/content/bindings/toolbarbutton.xml#menu");
}

.toolbarbutton-1[type="menu-button"] {
  padding: 0;
}

.toolbarbutton-1 > .toolbarbutton-menubutton-button,
.toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
  margin: 0;
}

.toolbarbutton-1 {
  margin: 2px 4px;
}

.toolbarbutton-1[open],
.toolbarbutton-1[open] > .toolbarbutton-menubutton-button {
  text-shadow: none;
}

.toolbarbutton-1[checked="true"] {
  background-color: transparent;
}

.toolbarbutton-1:not([type="menu-button"]),
.toolbarbutton-1 > .toolbarbutton-menubutton-button {
  -moz-box-orient: vertical;
}

toolbarbutton[type="menu-button"],
toolbox[mode="text"] .toolbarbutton-1,
toolbox[mode="text"] .toolbarbutton-menubutton-button,
toolbox[mode="text"] .toolbarbutton-menubutton-dropmarker,
toolbox[labelalign="end"] .toolbarbutton-1,
toolbox[labelalign="end"] toolbarpaletteitem .toolbarbutton-1,
toolbox[labelalign="end"] .toolbarbutton-1[type="menu-button"]
  > .toolbarbutton-menubutton-button,
toolbox[labelalign="end"] toolbarpaletteitem
  .toolbarbutton-1[type="menu-button"] > .toolbarbutton-menubutton-button {
  -moz-box-orient: horizontal;
}

toolbox[labelalign="end"] .toolbarbutton-1 .toolbarbutton-text {
  -moz-margin-start: 2px;
}

toolbox[labelalign="end"] > toolbar[mode="full"] deck .toolbarbutton-text {
  text-align: start;
}

.toolbarbutton-1[checked="true"] > .toolbarbutton-text {
  color: #0969b2;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);
}

.toolbarbutton-1:not([type="menu-button"]),
.toolbarbutton-1 > .toolbarbutton-menubutton-button {
  min-width: 28px;
}

toolbar:not([mode="icons"]) .toolbarbutton-1:not([type="menu-button"]),
toolbar:not([mode="icons"]) .toolbarbutton-1 > .toolbarbutton-menubutton-button {
  min-width: 0;
}

.toolbarbutton-1 > .toolbarbutton-icon,
.toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon {
  width: 18px;
  height: 18px;
  margin: 2px;
}

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

.toolbarbutton-1 > .toolbarbutton-menu-dropmarker,
.toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
  list-style-image: url(chrome://messenger/skin/icons/toolbarbutton-dropmarker.png) !important;
}

/* Separator between menu and split type buttons */
.toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker::before {
  content: "";
  display: -moz-box;
  width: 1px;
  height: 18px;
  -moz-margin-start: -6px;
  -moz-margin-end: 5px;
  margin-bottom: 2px;
  background: hsla(0, 0%, 0%, .3) padding-box;
  box-shadow: 0 0 0 1px hsla(0, 0%, 100%, .2);
}

@media (-moz-mac-lion-theme) {
  .toolbarbutton-1[disabled="true"] > .toolbarbutton-icon,
  .toolbarbutton-1[type="menu-button"]
    > .toolbarbutton-menubutton-button[disabled="true"] > .toolbarbutton-icon,
  .toolbarbutton-1[disabled="true"] > .toolbarbutton-menu-dropmarker,
  .toolbarbutton-1[disabled="true"] > .toolbarbutton-menubutton-dropmarker
    > .dropmarker-icon,
  .toolbarbutton-1:not(:hover):-moz-window-inactive .toolbarbutton-icon,
  .toolbarbutton-1:not(:hover):-moz-window-inactive
    > .toolbarbutton-menu-dropmarker,
  .toolbarbutton-1:not(:hover):-moz-window-inactive
    > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
    opacity: .5;
  }

  .toolbarbutton-1:-moz-window-inactive[disabled="true"] > .toolbarbutton-icon,
  .toolbarbutton-1:-moz-window-inactive[type="menu-button"]
    > .toolbarbutton-menubutton-button[disabled="true"] > .toolbarbutton-icon {
    opacity: .25;
  }

  .toolbarbutton-1 > .toolbarbutton-menu-dropmarker,
  .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
    list-style-image: url(chrome://messenger/skin/icons/toolbarbutton-dropmarker-lion.png) !important;
  }
}

.toolbarbutton-1 > .toolbarbutton-menu-dropmarker {
  -moz-margin-end: 1px;
}

.toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
  width: 16px;
  padding: 2px 4px !important;
}

toolbar:not([mode="icons"]) .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
  width: auto;
}

toolbar[mode="icons"] .toolbarbutton-1 > menupopup {
  margin-top: 1px;
}

.mail-toolbox > toolbar {
  -moz-appearance: none;
  /* force iconsize="small" on these toolbars */
  counter-reset: smallicons;
}

/* remove the small icons checkbox in Customize window */
#smallicons {
  display: none;
}

#button-getmsg {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(0px 18px 18px 0px);
}

#button-getmsg:not([disabled="true"]):active {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(18px 18px 36px 0px);
}

#button-newmsg {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(0px 36px 18px 18px);
}

#button-newmsg:not([disabled="true"]):active {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(18px 36px 36px 18px);
}

#button-address {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(0px 54px 18px 36px);
}

#button-address:not([disabled="true"]):active {
  -moz-image-region: rect(18px 54px 36px 36px);
}

#button-reply {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(0px 72px 18px 54px);
}

#button-reply:not([disabled="true"]):active {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(18px 72px 36px 54px);
}

#button-replyall {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(0px 90px 18px 72px);
}

#button-replyall:not([disabled="true"]):active {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(18px 90px 36px 72px);
}

#button-replylist {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(0px 126px 18px 108px);
}

#button-replylist:not([disabled="true"]):active {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(18px 126px 36px 108px);
}

#button-forward {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(0px 108px 18px 90px);
}

#button-forward:not([disabled="true"]):active {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(18px 108px 36px 90px);
}

.delete-button {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(0px 144px 18px 126px);
}

.delete-button:not([disabled="true"]):active {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(18px 144px 36px 126px);
}

.junk-button {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(0px 162px 18px 144px);
}

.junk-button:not([disabled="true"]):active {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(18px 162px 36px 144px);
}

#button-print {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(0px 180px 18px 162px);
}

#button-print:not([disabled="true"]):active {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(18px 180px 36px 162px);
}

#button-stop {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(0px 198px 18px 180px);
}

#button-stop:not([disabled="true"]):active {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(18px 198px 36px 180px);
}

#button-file {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(0px 216px 18px 198px);
}

#button-file:not([disabled="true"]):active {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(18px 216px 36px 198px);
}

#button-file > dropmarker {
  display: none;
}

#button-nextUnread, #button-nextMsg {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(0px 234px 18px 216px);
}

#button-nextUnread:not([disabled="true"]):active,
#button-nextMsg:not([disabled="true"]):active {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(18px 234px 36px 216px);
}

#button-previousUnread, #button-previousMsg {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(0px 252px 18px 234px);
}

#button-previousUnread:not([disabled="true"]):active, 
#button-previousMsg:not([disabled="true"]):active {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(18px 252px 36px 234px);
}

#button-mark {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(0px 270px 18px 252px);
}

#button-mark:not([disabled="true"]):active {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(18px 270px 36px 252px);
}

#button-tag {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(0px 288px 18px 270px);
}

#button-tag:not([disabled="true"]):active {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(18px 288px 36px 270px);
}

#button-goback {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(0px 306px 18px 288px);
}

#button-goback:not([disabled="true"]):active {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(18px 306px 36px 288px);
}

#button-goforward {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(0px 324px 18px 306px);
}

#button-goforward:not([disabled="true"]):active {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(18px 324px 36px 306px);
}

#button-compact {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(0px 342px 18px 324px);
}

#button-compact:not([disabled="true"]):active {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(18px 342px 36px 324px);
}

#button-archive {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(0px 360px 18px 342px);
}

#button-archive:not([disabled="true"]):active {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(18px 360px 36px 342px);
}

#button-chat {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(0px, 396px, 18px, 378px);
}

#button-chat:not([disabled="true"]):active {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(18px, 396px, 36px, 378px);
}

#button-chat[unreadMessages="true"] {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(36px, 396px, 54px, 378px);
  color: #0969b2;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);
}

/* ::::: end small primary toolbar buttons ::::: */

#palette-box #qfb-show-filter-bar {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(0px 378px 18px 360px);
}

#palette-box #qfb-show-filter-bar:not([disabled="true"]):active {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(18px 378px 36px 360px);
}

/* Force the folder location and mail view items to fit in the available width
   in the Customize Toolbar dialog. */
#palette-box #locationFolders,
#palette-box #folder-location-container,
#palette-box #viewPicker {
  -moz-box-flex: 1;
}

.msgNotificationBarText {
  font: icon;
  font-weight: bold;
  padding: 0;
}

.msgNotification-smallText {
  -moz-padding-start: 10px;
  font-size: 90%;
}

#junkBarImage {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(0px 162px 18px 144px);
}

#junkBar {
  background-color: #CAE2C5;
  padding: 6px 8px;
  color: black;
}

#junkIcon {
  list-style-image: url("chrome://messenger/skin/icons/folder-junk.png");
}

/* ::::: remote content bar status rules ::::: */

#remoteContentImage {
  list-style-image: url("chrome://messenger/skin/icons/warning.png");
}

#remoteContentBar {
  background-color: #FBFBC8;
  border: 1px solid #DDDDE1;
  color: black;
  padding: 0.3em 0.2em;
  border-bottom-left-radius: 0.2em;
  border-bottom-right-radius: 0.2em;
  border-top-left-radius: 0.2em;
  border-top-right-radius: 0.2em;
}

#remoteContentDescription {
  -moz-margin-start: 1.1em;
}

#remoteContentButton {
  margin-top: 0;
  margin-bottom: 0;
}

#phishingBarImage {
/* for now, temporarily copy the remote image icon until we can get a new one */
  list-style-image: url("chrome://messenger/skin/icons/warning.png");
}

#phishingBar {
  background-color: #EFF3D4;
  padding: 6px 8px;
  color: black;
}


#mdnBarImage {
  list-style-image: url("chrome://global/skin/icons/question-24.png");
}

#mdnBar {
  background-color: #FBFBC8;
  border: 1px solid #DDDDE1;
  color: black;
  padding: 0.3em 0.2em;
  border-bottom-left-radius: 0.2em;
  border-bottom-right-radius: 0.2em;
  border-top-left-radius: 0.2em;
  border-top-right-radius: 0.2em;
}


#CustomizeToolbarSheet > #main-box {
  border-top: none !important;
  border-left: 2px solid;
  border-right: 2px solid;
  border-bottom: 3px solid;
  -moz-border-right-colors: -moz-mac-menushadow ThreeDLightShadow !important;
  -moz-border-bottom-colors: -moz-mac-menushadow -moz-mac-menushadow ThreeDShadow !important;
  -moz-border-left-colors: ThreeDLightShadow ThreeDHighlight !important;
}

/* Lightweight themes support */

/* This prevent jumping of the toolbar when going between Default and Persona*/
#mail-bar3 {
  padding-bottom: 1px;
}

#mail-bar3:-moz-lwtheme {
  padding-bottom: 0px;
}
