/*** 1. Restore the normal appearance of the urlbar /Addressbar/Awesomebar - remove the windows vista styling
via https://www.ghacks.net/2020/04/08/how-to-restore-the-old-firefox-address-bar/
based on https://old.reddit.com/comments/fwhlva//fmolndz  */
#urlbar[breakout][breakout-extend]:not([open]) {
	top: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2) !important;
	left: 0 !important;
	width: 100% !important;
}
#urlbar[breakout][breakout-extend]:not([open]) > #urlbar-input-container {
	height: var(--urlbar-height) !important;
	padding-block: 0px !important;
	padding-inline: 0px !important;
}
#urlbar[breakout][breakout-extend][breakout-extend-animate] > #urlbar-background {
animation-name: none !important;
}
#urlbar[breakout][breakout-extend]:not([open]) > #urlbar-background {
	box-shadow: none !important;
}

/*** 2. Tighten up drop-down/context/popup menu spacing (8 Sep 2021) ***/
menupopup:not(.in-menulist) > menuitem, 
menupopup:not(.in-menulist) > menu {
  padding-block: 4px !important; /* reduce to 3px, 2px, 1px or 0px as needed */ 
 /*  min-height: unset !important; /* v92.0 - for padding below 4px */
}
:root {
  --arrowpanel-menuitem-padding: 4px 8px !important;
}


/*** 3. right click on image - remove redundant options ***/
/* source for context menu options https://searchfox.org/mozilla-release/source/browser/base/content/browser-context.inc */
/* #context-reloadimage,           /* Reload Image                    */
/* #context-viewimage,             /* View Image                      */
/* #context-copyimage-contents,    /* Copy Image                      */
/* #context-copyimage,             /* Copy Image Location             */
/* #context-sep-copyimage,         /************ Separator ************/
/* #context-saveimage,             /* Save Image As...                */
#context-sendimage,             /* Email Image...                  */
#context-setDesktopBackground,  /* Set As Desktop Background...    */
/* #context-viewimageinfo,         /* View Image Info                 */
/* #inspect-separator,             /************ Separator ************/
/* #context-inspect,               /* Inspect Element (Q)             */
#leave_this_dummy_here
    { display:none !important; }


    
/*** 4. Proton Tabs Tweaks https://www.userchrome.org/firefox-89-styling-proton-ui.html ***/

/* Adjust tab corner shape, optionally remove space below tabs */

#tabbrowser-tabs {
    --user-tab-rounding: 4px;
}

.tab-background {
    border-radius: var(--user-tab-rounding) var(--user-tab-rounding) 0px 0px !important; /* Connected */
    margin-block: 1px 0 !important; /* Connected */
}
#scrollbutton-up, #scrollbutton-down { /* 6/10/2021 */
    border-top-width: 1px !important;
    border-bottom-width: 0 !important;
}

/* 1/16/2022 Tone down the Fx96 tab border with add-on themes in certain fallback situations */
.tab-background:is([selected], [multiselected]):-moz-lwtheme {
    --lwt-tabs-border-color: rgba(0, 0, 0, 0.5) !important;
    border-bottom-color: transparent !important;
}
[brighttext="true"] .tab-background:is([selected], [multiselected]):-moz-lwtheme {
    --lwt-tabs-border-color: rgba(255, 255, 255, 0.5) !important;
    border-bottom-color: transparent !important;
}

/* Container color bar visibility */
.tabbrowser-tab[usercontextid] > .tab-stack > .tab-background > .tab-context-line {
    margin: 0px max(calc(var(--user-tab-rounding) - 3px), 0px) !important;
}


/*** Audio Playing / Mute Button side-by-side when sound is playing ***/

#TabsToolbar {
    --user-mute-button-height: 14px;  /* default size is 12px, site icon is 16px */
}

/* Move the mute/unmute button to the right and enlarge it */
.tab-icon-overlay:not([pinned], [sharing], [crashed]):is([soundplaying], [muted]) {
    width: var(--user-mute-button-height) !important;
    height: var(--user-mute-button-height) !important;
    margin-left: calc(var(--user-mute-button-height) / 2 + 4px) !important; /* pushes icon to the right */
    margin-right: 2px !important; /* closes up some space before the text */
    padding: 0 !important; /* allows icon to expand to full size */
}

/* Move the site icon to the left a bit and adjust position */
.tab-icon-stack:not([pinned], [sharing], [crashed]):is([soundplaying], [muted]) > :not(.tab-icon-overlay) {
    margin-left: -4px !important; /* pushes icon to the left */
    margin-top: calc((var(--user-mute-button-height) - 16px) / 2) !important;  /* keep site icon reasonably positioned */
}

/* Override the rules for hover/not hover visibility */
   /* for mute button */
.tabbrowser-tab:not(:hover) .tab-icon-overlay:not([pinned], [sharing], [crashed]):is([soundplaying], [muted]), 
   /* for site icon */
.tabbrowser-tab:hover .tab-icon-stack:not([pinned], [sharing], [crashed]):is([soundplaying], [muted]) > :not(.tab-icon-overlay), 
   /* for site icon with Compact density */
:root[uidensity="compact"] .tab-icon-stack:not([pinned], [sharing], [crashed]):is([soundplaying], [muted]) > :not(.tab-icon-overlay) {
    opacity: 1 !important; /* overrides full transparency with full opacity */
}

/* Color the icon on hover for confirmation or avoidance */
.tab-icon-overlay:not([pinned], [sharing], [crashed]):is([soundplaying], [muted]):hover {
    fill: green !important;
}
[lwthemetextcolor="bright"] .tab-icon-overlay:not([pinned], [sharing], [crashed]):is([soundplaying], [muted]):hover {
    fill: lightgreen !important; /* for dark themes */
}

/* Tweak Options above as of April 2023 */

/* 2024 extra setting to restore the original spinning circle loading animation */
.tab-throbber[busy]{background-image:url(chrome://global/skin/icons/loading.png)!important}
.tab-throbber[busy]:not([progress]){filter:grayscale(100%)}