/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ The janky download progress bar ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
/*--------------------------------------- Icon appearance ---------------------------------------*/
#downloads-indicator-icon {

transform: scale(1.2, 1.2) !important;
margin-top: 1px !important;
animation: alternate !important;
opacity: 0.95 !important;}

#downloads-button[attention="success"] #downloads-indicator-icon {fill:  !important;}
/*-----------------------------------------------------------------------------------------------*/

/*----------------------------------- Progress bar appearance -----------------------------------*/
#downloads-notification-anchor[notification="start"] > #downloads-indicator-notification {display: none !important;}
#downloads-indicator-progress-inner {background: url("Inner.png") center no-repeat !important;}
#downloads-indicator-progress-outer {background: url("Outer.png") center no-repeat !important;}
#downloads-button[progress]   {
transform: scale(3, 1) !important;
opacity: 0.8 !important;
margin-right: 24px !important;
margin-left: 24px !important;
padding: 0px !important;
padding-right: 0px !important;
padding-left: 0px !important;}
#downloads-button[progress] stack {
margin-left: 2px !important;
margin-right: 2px !important;
padding-right: 0px !important;
padding-left: 0px !important;
border-radius: 1px !important;}
/*-----------------------------------------------------------------------------------------------*/

/*------------------------------- Progress bar visibility handling ------------------------------*/
#downloads-indicator-progress-inner {visibility: hidden !important;}
#downloads-indicator-progress-outer {visibility: hidden !important;}
#downloads-button[progress] #downloads-indicator-icon {visibility: hidden !important;}
#downloads-button[progress] #downloads-indicator-progress-inner {visibility: visible !important;}
#downloads-button[progress] #downloads-indicator-progress-outer {visibility: visible !important;}
/*-----------------------------------------------------------------------------------------------*/
/*Code below is optional, it makes it so after you click on the downloads
  button and there is nothing in queue, the button will disappear.
  Remove "/**" to activate it.
/*----------------------------- Hide downloads button after clicking ----------------------------*/
/**
#downloads-button {display: none;}
#downloads-button[open="true"] {display: initial !important;}
#downloads-button[progress="true"] {display: initial !important;}
#downloads-button[attention="success"] {display: initial !important;}
/*-----------------------------------------------------------------------------------------------*/



/*Alternatively, you can use this code below (which i prefer) instead
  -it'll make it so when downloading is finished,
  the button will disappear.
/*--------------------- Hide downloads button after downloading is finished ---------------------*/
/**
#downloads-button {display: none;}
#downloads-button  {margin-top: 3px !important;}
#downloads-button[open="true"] {display: initial !important;}
#downloads-button[progress="true"] {display: initial !important;}
#downloads-button[attention="success"] {display: initial !important;}
#downloads-button[attention="success"] {display: none !important;}
/*-----------------------------------------------------------------------------------------------*/
/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/