Colored Audio Tab transparency broken

[ORCACommander]

!!! READ THIS BEFORE OPENING A NEW ISSUE REPORT !!!

-> use the TEMPLATE (1-5) at the bottom after reading everything on this page <-

INVALID REPORTS WILL BE CLOSED WITHOUT FURTHER NOTICE TO KEEP ISSUE AREA CLEAN.
By submitting a new issue you confirm having read and understood 'how to report a new issue'.
-> #4 <-
Thanks for your understanding.

SUPPORT is only offered for features CustomCSSforFx project provides

• This is not a 'request' area for new stuff or features.
• Do not open a new issue about something this project does not offer.
• Make sure 'about:config > toolkit.legacyUserProfileCustomizations.stylesheets' is set to 'true'.
• Join the discussion threads to chat and ask questions.
• GENERAL TALK, FEEDBACK & QUESTIONS: --> Post all questions and feedback into this discussion thread! #722
• MULTIROW TABS SUPPORT THREAD --> [MULTIROW TABS SUPPORT THREAD] - multiple tab lines #455

NO SUPPORT for

• outdated versions of CustomCSSforFx
• deprecated features of (legacy) add-ons
• visual issues without offering screenshots

---

Add all information required in 1-5 and delete this line and everything above it before submitting.

1. Does the issue occur without any files inside /chrome/ folder?
   -> If it does, it might be a Firefox bug not related to this projects files, so "the issue report" is most likely wrong here.
   No

2. Issue description, userChrome.css/userContent.css 'settings' the issue occurs with and steps to reproduce the issue:
   enabling @import "./css/tabs/tab_audio_icon_colorized.css"; /**/ in userChrome results in the audio icon on a tab not being transparent

3. Does the issue occur with the most recent version of CustomCSSforFx (release/test/dev build)?
   -> Check here: https://github.com/Aris-t2/CustomCSSforFx/releases <-
   4.6.9.V2

4. Screenshots showing the issue (drag & drop images into this post):
   

5. System information

• OS & OS version: Windows 10 Pro
• DPI/HiDPI/scaling value, if not 100% (e.g. 125%, 150%...): 100%
• Firefox version: 133.0.3 (64-bit)
• Firefox theme (e.g. default, build in light/dark, external theme + link): Happens with both Dark 1.3.2 and https://addons.mozilla.org/en-US/firefox/addon/anime-firefox-girl-nebula-b/

[Speravir]

Add this to your userChrome.css or a file imported by this, e.g. my_userChrome.css if you follow Aris’ suggestions:

.tab-icon-overlay:is([soundplaying], [muted], [activemedia-blocked]) {
  background-color: transparent !important
}

(Untested.)

[ORCACommander]

yep that works

[Aris-t2]

How about 90% transparency instead of full transparency?

I plan to add this to next update:

.tab-icon-overlay:is([soundplaying], [muted], [activemedia-blocked]) {
  background-color: rgba(0,0,0,0.1) !important
}
@media (-moz-toolbar-prefers-color-scheme: dark), (prefers-color-scheme: dark) {
  .tab-icon-overlay:is([soundplaying], [muted], [activemedia-blocked]) {
    background-color: rgba(255,255,255,0.1) !important
  }
}