/* See license.txt for terms of usage */

/******************************************************************************/
/* Panel Toolbar */

.theme-firebug .theme-toolbar,
.theme-firebug toolbar,
.theme-firebug .devtools-toolbar {
  -moz-appearance: none;
  border-bottom: 1px solid rgb(170, 188, 207) !important;
  background-color: rgb(219, 234, 249) !important;
  background-image: linear-gradient(rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.2));
  padding-right: 4px;
}

/* The vbox for panel content also uses theme-toolbar class from some reason
 but it shouldn't have the padding as defined above, so fix it here */
.theme-firebug #toolbox-deck > .toolbox-panel.theme-toolbar {
  padding-right: 0;
}

.theme-firebug #panelToolbar,
.theme-firebug .devtools-toolbar {
  padding: 3px;
}

.theme-firebug #panelToolbar {
  height: 28px;
  -moz-box-flex: 1;
}

.theme-firebug #panelSideBox #panelToolbar {
  height: 28px;
  padding: 0;
}

.theme-firebug .theme-toolbar,
.theme-firebug .devtools-toolbar {
  height: 28px !important;
}

.theme-firebug toolbarseparator {
  min-height: 0;
}

.theme-firebug .theme-toolbar .label {
  font-family: Lucida Grande,Tahoma,sans-serif;
}

/******************************************************************************/
/* Toolbar Buttons */

.theme-firebug .theme-toolbar button,
.theme-firebug .devtools-button,
.theme-firebug toolbarbutton {
  background-color: transparent;
  -moz-appearance: none;
  margin-right: 1px;
  border: 1px solid transparent;
  border-radius: 2px;
  color: #141414;
  width: auto;
  line-height: 12px;
  font-size: 12px;
  /* The icon is absolutely positioned in the button using ::before */
  position: relative;
}

.theme-firebug .theme-toolbar button,
.theme-firebug .devtools-button {
  border-width: 1px !important;
  min-height: 21px;
  min-width: 24px;
}

/* We might want to change this if toolbar buttons have icons,
but for now do not allocate an extra space for images */
.theme-firebug toolbarbutton > image {
  -moz-margin-end: 0;
}

.theme-firebug toolbarbutton[type="menu-button"] {
  border-color: rgba(0, 0, 0, 0.1);
  padding: 0 !important;
}

.theme-firebug .theme-toolbar button:hover:not([disabled="true"]),
.theme-firebug .devtools-button:hover:not([disabled="true"]),
.theme-firebug toolbarbutton:hover:not([disabled="true"]) {
  border-color: rgba(0, 0, 0, 0.2);
  background: transparent linear-gradient(rgba(255, 255, 255, 0.4),
    rgba(255, 255, 255, 0.2)) no-repeat;
  box-shadow: 1px 1px 1px rgba(255, 255, 255, 0.6) inset, 0 0 1px rgba(255, 255, 255, 0.6) inset,
    0 0 2px rgba(0, 0, 0, 0.05);
}

/* Note the special selector part for the #resume button. */
.theme-firebug toolbarbutton:-moz-any([checked="true"],
  [selected="true"],
  [open="true"]):not(.panelStatusLabel):not([disabled="true"]):not(#resume) {
  border-color: rgba(0, 0, 0, 0.3);
  background-image: linear-gradient(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7));
  box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.05) inset, 0px 0px 1px rgba(0, 0, 0, 0.1) inset;
}

.theme-firebug .theme-toolbar button:hover:active:not([disabled="true"]),
.theme-firebug .devtools-button:hover:active:not([disabled="true"]),
.theme-firebug toolbarbutton:hover:active:not([disabled="true"]) {
  border-color: rgba(0, 0, 0, 0.3);
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1) inset, 0 0 1px rgba(0, 0, 0, 0.1) inset,
    0 0 2px rgba(0, 0, 0, 0.05);
}

.theme-firebug .theme-toolbar button:hover:active:not([disabled="true"]):not([type="menu-button"]),
.theme-firebug .devtools-button:hover:active:not([disabled="true"]):not([type="menu-button"])
.theme-firebug toolbarbutton:hover:active:not([disabled="true"]):not([type="menu-button"]) {
  background-image: linear-gradient(rgba(0, 0, 0, 0.2), transparent);
  background-repeat: no-repeat;
}

/* Used e.g. by the Animation side panel and Memory panel*/
.theme-firebug .devtools-toolbarbutton::before,
.theme-firebug .devtools-button::before {
  filter: url(filters.svg#invert);
}

.theme-firebug .devtools-button::before {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -8px 0 0 -8px;
  background-repeat: no-repeat;
}

.theme-firebug .devtools-button[disabled]::before,
.theme-firebug .devtools-button:disabled::before {
  opacity: 0.5;
}

@media (min-resolution: 1.1dppx) {
  .theme-firebug .devtools-button::before {
    background-size: 32px;
  }
}

/******************************************************************************/
/* Toolbar Stuff */

.theme-firebug .devtools-toolbar span,
.theme-firebug .devtools-toolbar select,
.theme-firebug .devtools-toolbar input {
  vertical-align: middle;
}

.theme-firebug .devtools-toolbar select {
  border: 1px solid transparent;
  border-color: rgba(0, 0, 0, 0.2);
  box-shadow: 1px 1px 1px rgba(255, 255, 255, 0.6) inset, 0 0 1px rgba(255, 255, 255, 0.6) inset,
    0 0 2px rgba(0, 0, 0, 0.05);
}

/******************************************************************************/
/* Win */

.theme-firebug .devtools-button,
.theme-firebug toolbarbutton {
  padding: 1px 3px;
}

.theme-firebug .toolbar-text-button > .toolbarbutton-icon:not([src]),
.theme-firebug .toolbar-text-menubutton > .toolbarbutton-icon:not([src]),
.theme-firebug toolbarbutton[type="menu"] > .toolbarbutton-icon:not([src]) {
  display: none;
}

.theme-firebug .toolbar-text-menubutton:hover:active,
.theme-firebug .toolbar-text-menubutton[open="true"] {
  padding: 4px 5px 2px 7px;
}

/******************************************************************************/
/* Drop Down Buttons */

.theme-firebug .toolbarbutton-menu-dropmarker {
  padding: 3px 7px;
}

.theme-firebug toolbarbutton[type="menu-button"] {
  padding: 0 !important;
}

.theme-firebug toolbarbutton[type="menu-button"] > .toolbarbutton-menubutton-button {
  -moz-appearance: none;
  border-radius: 0;
  padding: 1px 6px;
}

.theme-firebug .toolbarbutton-menu-dropmarker,
.theme-firebug .toolbarbutton-menubutton-dropmarker {
  -moz-appearance: none !important;
  list-style-image: url(chrome://firebug/skin/dropMarker.svg);
  -moz-box-pack: center;
  -moz-box-align: center;
  margin: 0;
  padding: 0 6px 0 7px;
}

.theme-firebug toolbarbutton[type="menu-button"]:not(:hover):not(:active):not(:-moz-any([checked="true"], [selected="true"], [open="true"])) > :-moz-any(.toolbarbutton-menu-dropmarker, .toolbarbutton-menubutton-dropmarker)::before {
  content: "";
  display: -moz-box;
  width: 1px;
  height: 15px;
  -moz-margin-start: -7px;
  -moz-margin-end: 7px;
  background-color: rgba(0, 0, 0, 0.15);
}

.theme-firebug toolbarbutton[type="menu-button"]:-moz-any(:hover, [checked="true"], [selected="true"], [open]) > .toolbarbutton-menubutton-button {
  -moz-border-end: 1px solid rgba(0, 0, 0, 0.2);
}

.theme-firebug toolbarbutton[type="menu-button"][open="true"]:not([disabled="true"]) > .toolbarbutton-menubutton-dropmarker {
  border-color: rgba(0, 0, 0, 0.3);
  background: transparent linear-gradient(rgba(0, 0, 0, 0.1), transparent) no-repeat;
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1) inset, 0 0 1px rgba(0, 0, 0, 0.1) inset;
}

.theme-firebug toolbarbutton > label,
.theme-firebug toolbarbutton > toolbarbutton {
  margin: 0;
  border: none;
  padding: 0;
}

.theme-firebug toolbarbutton[type="menu"]:-moz-locale-dir(ltr),
.theme-firebug toolbarbutton[type="menu"]:-moz-locale-dir(ltr) > toolbarbutton {
  padding-right: 0;
}

.theme-firebug toolbarbutton[type="menu"]:-moz-locale-dir(rtl),
.theme-firebug toolbarbutton[type="menu"]:-moz-locale-dir(rtl) > toolbarbutton {
  padding-left: 0;
}

.theme-firebug toolbarbutton[disabled="true"] {
  color: graytext;
}

.theme-firebug .panelStatusLabel[selected="true"] {
  font-weight: bold;
}

.theme-firebug .panelStatusLabel > .toolbarbutton-icon {
  margin: 0;
}

