
.menubutton-dual.top
  {
    -moz-binding          : url("chrome://global/content/menulistBindings.xml#menubutton-dual-ex");
    border                : 1px solid transparent;
    -moz-user-focus       : ignore !important;
  }

.menubutton-dual.left
  {
    -moz-binding          : url("chrome://global/content/menulistBindings.xml#menubutton-dual-ex-left");
    border                : 1px solid transparent;
    -moz-user-focus       : none !important;
  }  
  
/* internal button */  
.menubutton-dual-ex-button.top
  {
    -moz-binding          : url("chrome://global/skin/buttonBindings.xml#simplebutton");
    border                : 1px solid transparent;
    min-width             : 47px;
    margin                : 0px;
    padding               : 2px 7px 2px 6px;
    -moz-user-focus       : ignore !important;
    background-color      : -moz-Dialog;
    color                 : -moz-DialogText;
  }  

.menubutton-dual-ex-button.left
  {
    -moz-binding          : url("chrome://global/skin/buttonBindings.xml#simplebutton-left");
    border-left           : 1px solid ThreeDHighlight;
    border-top            : 1px solid ThreeDHighlight;
    border-right          : 1px solid ThreeDShadow;
    border-bottom         : 1px solid ThreeDShadow;
    margin                : 0px;
    padding               : 2px 7px 2px 6px;
    -moz-user-focus       : none !important;
    background-color      : -moz-Dialog;
    color                 : -moz-DialogText;
  }  

/* dropmarker */
.menubutton-dropmarker
  {
    list-style-image      : url("chrome://global/skin/scroll-down.gif");
  } 
  
.menubutton-dual > .menubutton-dual-dropmarker-box
  {
    border                : 1px solid transparent;
    padding               : 1px 0px 1px 0px;
  }

.menubutton-dual.left > .menubutton-dual-dropmarker-box
  {
    border-left           : 1px solid ThreeDHighlight;
    border-top            : 1px solid ThreeDHighlight;
    border-right          : 1px solid ThreeDShadow;
    border-bottom         : 1px solid ThreeDShadow;
    padding               : 1px 0px 1px 0px;
  }  
  
/** disabled **/
.menubutton-dual-ex-button[disabled="true"]
  {
    color                 : GrayText;
  }  

.menubutton-dual[disabled="true"] > .menubutton-dual-dropmarker-box > .menubutton-dropmarker
  {
    list-style-image      : url("chrome://global/skin/scroll-down-disabled.gif");
  }  
  
  
  
/* ACTION: mouseover the button */
 
  /* 1). button gets outset border */
  .menubutton-dual-ex-button:hover
    {
      border-left           : 1px solid ThreeDHighlight;
      border-top            : 1px solid ThreeDHighlight;
      border-right          : 1px solid ThreeDShadow;
      border-bottom         : 1px solid ThreeDShadow;
      color                 : blue;
    }

  .menubutton-dual[disabled="true"] > .menubutton-dual-ex-button:hover
    {
      border                : 1px solid transparent;
      color                 : GrayText;
    }
    
/**
 * XXX - this is a hack. :hover does not work to spec and so we're using a binding
 *       with JS that lives in xpfe/global/resources/content/menulistBindings.xml
 *       to set attributes on various parts of the button when mouse down/over 
 *       events fire. When :hover works correctly, this can be removed (see
 *       revision 1.21 of this file for details.
 */

  /* 2) menubutton gets black border */
  .menubutton-dual[buttonover="true"]
    {
      border                : 1px solid ThreeDDarkShadow;
    }
    
  .menubutton-dual[buttonover="true"][disabled="true"]
    {
      border                : 1px solid transparent;
    }
    
  .menubutton-dual[disabled="true"]:hover > .menubutton-dual-ex-button,
  .menubutton-dual[disabled="true"][buttonover="true"] > .menubutton-dual-ex-button
    {
      border                : 1px solid transparent;
    }

  /* 3) dropmarker gets outset border */
  .menubutton-dual[buttonover="true"] > .menubutton-dual-dropmarker-box
    {
      border-left           : 1px solid ThreeDHighlight;
      border-top            : 1px solid ThreeDHighlight;
      border-right          : 1px solid ThreeDShadow;
      border-bottom         : 1px solid ThreeDShadow;
    }    
    
  .menubutton-dual[buttonover="true"][disabled="true"] > .menubutton-dual-dropmarker-box
    {
      border                : 1px solid transparent;
    }

/* ACTION: mousedown on the button */

  /* 1). button gets inset border */
  .menubutton-dual-ex-button:hover:active
    {
      border-left           : 1px solid ThreeDShadow !important;
      border-top            : 1px solid ThreeDShadow !important;
      border-right          : 1px solid ThreeDHighlight !important;
      border-bottom         : 1px solid ThreeDHighlight !important;
      padding               : 3px 6px 1px 7px !important;
      color                 : #000080 !important;
    }
    
  .menubutton-dual-ex-button[disabled="true"]:hover:active
    {
      border                : 1px solid transparent !important;
      padding               : 2px 7px 2px 6px !important;
    }
    
  /* 2). dropmarker gets inset border */
  .menubutton-dual[buttondown="true"] > .menubutton-dual-dropmarker-box
    {
      border-left           : 1px solid ThreeDShadow !important;
      border-top            : 1px solid ThreeDShadow !important;
      border-right          : 1px solid ThreeDHighlight !important;
      border-bottom         : 1px solid ThreeDHighlight !important;
      padding               : 2px 0px 0px 0px !important;
    }    
    
  .menubutton-dual[buttondown="true"][disabled="true"] > .menubutton-dual-dropmarker-box
    {
      border                : 1px solid transparent !important;
      padding               : 0px !important;
    }
    
/* ACTION: mouse over the menu */
  
  /* 1). menubutton gets black border */
  .menubutton-dual:hover
    {
      border                : 1px solid ThreeDDarkShadow;
    }
    
  .menubutton-dual[disabled="true"]:hover
    {
      border                : 1px solid transparent;
    }
    
  /* 2). button gets outset border */
  .menubutton-dual:hover > .menubutton-dual-ex-button
    {
      border-left           : 1px solid ThreeDHighlight;
      border-top            : 1px solid ThreeDHighlight;
      border-right          : 1px solid ThreeDShadow;
      border-bottom         : 1px solid ThreeDShadow;
      color                 : blue;
    }
    
  /* 3). dropmarker gets outset border */
  .menubutton-dual:hover > .menubutton-dual-dropmarker-box
    {
      border-left           : 1px solid ThreeDHighlight;
      border-top            : 1px solid ThreeDHighlight;
      border-right          : 1px solid ThreeDShadow;
      border-bottom         : 1px solid ThreeDShadow;
    }

  .menubutton-dual[disabled="true"]:hover > .menubutton-dual-dropmarker-box
    {
      border                : 1px solid transparent;
    }

/* ACTION: open the menu */
  
  /* 1). menubutton gets black border */
  .menubutton-dual[open="true"]
    {
      border                : 1px solid ThreeDDarkShadow;
    }
  
  /* 2). button gets outset border */
  .menubutton-dual[open="true"] > .menubutton-dual-ex-button
    {
      border-left           : 1px solid ThreeDHighlight;
      border-top            : 1px solid ThreeDHighlight;
      border-right          : 1px solid ThreeDShadow;
      border-bottom         : 1px solid ThreeDShadow;
      color                 : blue;
    }
  
  /* 3). dropmarker gets inset border */
  .menubutton-dual[open="true"] > .menubutton-dual-dropmarker-box
    {
      border-left           : 1px solid ThreeDShadow;
      border-top            : 1px solid ThreeDShadow;
      border-right          : 1px solid ThreeDHighlight;
      border-bottom         : 1px solid ThreeDHighlight;
      padding               : 2px 0px 0px 0px;
    }

/** menubuttons on generic grey toolbars
 *  class="button-toolbar"
 **/ 
  .button-toolbar > .menubutton-internal-box
    {
      border                : none;
      padding               : 1px 3px 1px 3px;
    }
 
  menubutton.button-toolbar-4,
  menubutton.button-toolbar
    {
      -moz-binding            : url("chrome://communicator/skin/menubuttonBindings.xml#menubutton-toolbar-single");
    }
    
  .menubutton-toolbar-single-internal-box,
  .button-toolbar[disabled="true"]:hover 
      > .menubutton-toolbar-single-internal-box,
  .button-toolbar-4[disabled="true"]:hover 
      > .menubutton-toolbar-single-internal-box,
  .button-toolbar[disabled="true"]:hover:active 
      > .menubutton-toolbar-single-internal-box,
  .button-toolbar-4[disabled="true"]:hover:active 
      > .menubutton-toolbar-single-internal-box
    {
      border                  : 1px solid transparent;
      padding                 : 1px 3px 1px 3px;
      vertical-align          : middle;
    }

  menubutton.button-toolbar > .menubutton-toolbar-single-internal-box > .menubutton-toolbar-single-icon
    {
      margin-right            : 5px;
    }
  
  .menubutton-toolbar-single-dropmarker
    {
      list-style-image        : url("chrome://global/skin/scroll-up.gif");
    }  
  
  .button-toolbar > .menubutton-toolbar-single-internal-box > .menubutton-toolbar-single-dropmarker
    {
      list-style-image        : url("chrome://global/skin/scroll-down.gif");
    }
      
  .button-toolbar[disabled="true"] > .menubutton-toolbar-single-internal-box > .menubutton-toolbar-single-dropmarker
    {
      list-style-image        : url("chrome://global/skin/scroll-down-disabled.gif");
    }  
    
  .button-toolbar:hover > .menubutton-toolbar-single-internal-box,
  .button-toolbar-4:hover > .menubutton-toolbar-single-internal-box
    {
      border-left             : 1px solid ThreeDHighlight;
      border-top              : 1px solid ThreeDHighlight;
      border-right            : 1px solid ThreeDShadow;
      border-bottom           : 1px solid ThreeDShadow;
    }  
    
  menubutton.button-toolbar-4:hover:active,
  menubutton.button-toolbar-4[open="true"],
  menubutton.button-toolbar:hover:active,
  menubutton.button-toolbar[open="true"]
    {
      border                 : 1px solid ThreeDDarkShadow;
    }  
    
  .button-toolbar-4:hover:active > .menubutton-toolbar-single-internal-box,
  .button-toolbar-4[open="true"] > .menubutton-toolbar-single-internal-box,
  .button-toolbar:hover:active > .menubutton-toolbar-single-internal-box,
  .button-toolbar[open="true"] > .menubutton-toolbar-single-internal-box
    {
      border-left            : 1px solid ThreeDShadow;
      border-top             : 1px solid ThreeDShadow;
      border-right           : 1px solid ThreeDHighlight;
      border-bottom          : 1px solid ThreeDHighlight;
      padding                : 2px 2px 0px 4px;
    }  
    
/* menubutton button-toolbar-2 */
  
/** 
 * Single Menubuttons (for toolbars, etc)
 */
menubutton.button-toolbar-2
  {
    -moz-binding            : url("chrome://global/content/menulistBindings.xml#menubutton-single-right") !important;
    border                  : 1px solid transparent;
    margin                  : 0px;
  }

menubutton.button-toolbar-2 > .menubutton-internal-box
  {
    border                  : 1px solid transparent;
    padding                 : 2px 2px 2px 4px;    
    vertical-align          : middle;
  }  

menubutton.button-toolbar-2 > .menubutton-internal-box > .menubutton-single-icon
  {
    list-style-image        : url("chrome://global/skin/scroll-down.gif");
    padding-left            : 2px;
  }

menubutton.button-toolbar-2:hover
  {
    border                  : 1px solid threeddarkshadow;
  }    

menubutton.button-toolbar-2:hover > .menubutton-internal-box
  {
    border-left             : 1px solid threedhighlight;
    border-top              : 1px solid threedhighlight;
    border-right            : 1px solid threedshadow;
    border-bottom           : 1px solid threedshadow;
  }
 
 
 
menubutton.button-toolbar-2:hover:active > .menubutton-internal-box,
menubutton.button-toolbar-2[open="true"] > .menubutton-internal-box
  {
    border-left             : 1px solid threedshadow;
    border-top              : 1px solid threedshadow;
    border-right            : 1px solid threedhighlight;
    border-bottom           : 1px solid threedhighlight;
    padding                 : 3px 1px 1px 5px;
  }
 
menubutton.button-toolbar-2.top {
  -moz-binding        : url("chrome://global/content/xulBindings.xml#buttontop") !important;
}

menubutton.button-toolbar-2.bottom {
  -moz-binding        : url("chrome://global/content/xulBindings.xml#buttontop") !important;
}

/** Low profile rollover menubuttons
 **/  
 
.menubutton-dual.button-toolbar-3
  {
    -moz-binding          : url("chrome://global/content/menulistBindings.xml#menubutton-dual-ex");
  }  
  
.menubutton-dual.button-toolbar-3 > .menubutton-dual-ex-button,
.menubutton-dual.button-toolbar-3 > .menubutton-dual-dropmarker-box
  {
    border-left           : 1px solid ThreeDHighlight;
    border-top            : 1px solid ThreeDHighlight;
    border-right          : 1px solid ThreeDShadow;
    border-bottom         : 1px solid ThreeDShadow;
  }

.menubutton-dual.button-toolbar-3[buttondown="true"] > .menubutton-dual-dropmarker-box,
.menubutton-dual.button-toolbar-3[open="true"] > .menubutton-dual-dropmarker-box
  {
    border-left           : 1px solid ThreeDShadow !important;
    border-top            : 1px solid ThreeDShadow !important;
    border-right          : 1px solid ThreeDHighlight !important;
    border-bottom         : 1px solid ThreeDHighlight !important;
  }
    
