my_userChrome.css

/************************************************************************************************/
/* Remove white flash before page load */
#browser vbox#appcontent tabbrowser, #content, #tabbrowser-tabpanels,
browser[type=content-primary],browser[type=content] > html {
    background: #1D1B19 !important
}
/************************************************************************************************/
/*-------------------- return transparent url bar and makes selecting text white with black background for easy view--------------------*/


:-moz-any(#urlbar-background, #urlbar-input-container,.urlbarView-body-inner, #searchbar, .searchbar-textbox) {
  background-color: transparent !important;
  color: #595959 !important;
}

:-moz-any(#urlbar, #searchbar, .searchbar-textbox) ::-moz-selection {
  background: black !important;
  color: white !important;
}

#identity-icon{
  opacity: 1 !important;
}

/************************************************************************************************/
#titlebar {margin-bottom: -4px !important;}
#titlebar{ -moz-appearance: none !important; }
/************************************************************************************************/
.tab-background[selected],
.browser-toolbar{ background: transparent !important }
/************************************************************************************************/
.tabbrowser-tab:not([selected]) .tab-content{
    color: #363636 !important;
}
.tabbrowser-tab[selected] .tab-label { color: #dcdcdc !important; }
/************************************************************************************************/
#navigator-toolbox{ margin-top: -1px !important }
/************************************************************************************************/
/*--------------------------- hide tracking protection icon --------------------------*/
#tracking-protection-icon-container{ display:none;}
/************************************************************************************************/

/* TABS: height */

#TabsToolbar {
  height: var(--tab-min-height) !important;
  margin-top: 1px !important;
  margin-bottom: 0px !important;
  box-shadow: ThreeDShadow 0 -1px inset, -moz-dialog 0 0.5px !important; /* omit */
  background-color: var(--toolbar-bgcolor) !important;
  color: var(--toolbar-color) !important;
}


:root { --tab-min-height: 20px !important; }

.tabbrowser-tab {
    height: var(--tab-min-height) !important;
}

/***********************************************************************************************/
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/hide_tabs_scrollbuttons.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */

/* This should hide tabs scrollbuttons in a manner that preserves the ability to move tab strip when reordering tabs */

#tabbrowser-tabs:not([movingtab]){ --uc-scroll-visibility: hidden }
#tabbrowser-tabs[overflow]{ --uc-scrollbox-margin: -28px }

#scrollbutton-up{ position: relative;z-index: 1 }

#scrollbutton-up,
#scrollbutton-down,
#scrollbutton-up ~ spacer{
  visibility: var(--uc-scroll-visibility,visible);
}
.scrollbox-clip{ margin-inline: var(--uc-scrollbox-margin,0); }
/***********************************************************************************************/
  /** Menu - Reduce Padding ***************************************************/
  :root:not([uidensity=touch]) menupopup > menuitem, menupopup > menu {
    padding-block:     0.35em !important; /* Original: 0.5em */
  }
  :root:not([uidensity=touch]) .menu-text, .menu-iconic-text {
    padding-inline-end: 0 !important; /* Original: 2px */
  }
  :root:not([uidensity=touch]) #context-navigation:not([hidden]) {
    padding: 0 0 1px; /* Original: 0 0 4px*/
  }
  :root:not([uidensity=touch]) .menu-right {
    margin-right: 6px !important; /* Original: 12px */
  }

  :root[uidensity=compact] menupopup > menuitem, menupopup > menu {
    padding-block:     0.25em !important; /* Original: 0.5em */
  }
}
/***********************************************************************************************/
/*--------------------------- layout.css.backdrop-filter.enabled -have to be set on true --------------------------*/
/* Backdrop filter URLbar + glow removed */

#urlbar[breakout][breakout-extend] {
    top: 0px !important;
    left: 0px !important;
    width: 100% !important;
}

#urlbar-input-container {
    border: none !important;
}

#urlbar[breakout][breakout-extend] > #urlbar-input-container {
    height: var(--urlbar-toolbar-height) !important;
    padding-block: 0px !important;
    padding-inline: 0px !important;
}

#urlbar-results {
    padding: 0px !important;
}

.urlbarView {
    margin-inline: 0px !important;
    border: none !important;
    width: 100% !important;
    box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, .32) !important;
    clip-path: inset(0px -20px -30px -20px) !important;
    animation: none !important;
    margin-block-start: 0px !important;
    outline: none;
}

.urlbarView-results {
    padding-block: 0px !important;
}

.urlbarView .urlbarView-row {
    border-radius: 0px !important;
    padding-block: 0px !important;
}

.urlbarView-row-inner {
    border-radius: 0px !important;
}

.urlbarView-body-inner {
    border: none !important;
}

.urlbarView-title {
    height: 18px !important;
}
/* choose #0C0C0DC0 for 5% black */
@supports (backdrop-filter: blur(1px)) {
    .urlbarView {
        background: #000000 !important;
        backdrop-filter: blur(28px) !important;
    }
}
/***********************************************************************************************/
/* Enables transparency/blur on the search box too */
.search-one-offs, .search-panel-header, .search-panel-one-offs {
    background: none !important;
}
/***********************************************************************************************/
  /** Sound Tab - Hide Label **************************************************/
  .tab-secondary-label:is([soundplaying], [muted], [activemedia-blocked], [pictureinpicture]){
    display: none !important;
  }

  /* Makes the speaker icon to always appear if the tab is playing (not only on hover) */
  .tab-icon-overlay:not([crashed]),
  .tab-icon-overlay[pinned][crashed][selected] {
    /* Position */
    top: 0px !important;
    inset-inline-end: 4px !important;
    z-index: 1 !important;

    /* Shape */
    padding: 0.2px !important;
    border-radius: 3px !important;
    width:  26px !important;
    height: 16px !important;
  }

  .tab-icon-overlay:not([sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) {
    /* Color */
    color:  lime !important;
    stroke: transparent !important;
    background: black !important;
    fill-opacity: 0.8 !important;
    opacity: 0.8 !important;
  }

.tab-icon-overlay[muted] {
fill: red !important;}

  .tab-icon-overlay:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) {
    margin-inline-end: 0px !important;
  }
/***********************************************************************************************/
/* Gray out the favicon icon on the inactive tab */
        .tabbrowser-tab .tab-icon-image:not([selected=true]):not([pinned]) {
        filter: grayscale(75%) !important;
        }
/***********************************************************************************************/
/*--------------------------- change fonts and background color in print dialog window --------------------------*/
@-moz-document url-prefix("chrome://global/content/print.html") {
  body {
    background: #474747 !important;
    color: white !important;
    font-size: 1.2rem;
    font-family: 'Tahoma' !important;
  }

  #printer-picker {

    font-family: 'Tahoma' !important;
    font-size: 1.1rem !important;
  }

  label, .label, #open-dialog-link {
    font-family: 'Tahoma' !important;
    font-size: 1.1rem !important;
  }

  html|button:enabled:hover, [multiple]):enabled:hover, html|input[type="color"]:hover, xul|button:not([disabled="true"]):hover, xul|menulist:not([disabled="true"]):hover {
    background-color: #474747 !important;
  }

  html|select:not([size], [multiple]) {
    background-color: black !important;
    font-size: 1.1rem !important;
    font-family: 'Tahoma' !important;
  }

  html|a:hover, .text-link:hover {
    color: var(--in-content-link-color-hover);
    text-decoration: none !important;
  }

  #button-container > button {
    flex: 1 1 auto;
    margin: 0;
    font-family: 'Tahoma' !important;
    border: 1px solid #474747 !important;
  }

  * {
    scrollbar-width: none !important;
    scrollbar-color: rgb(27,27,27) rgb(12,12,12) !important;
  }

}
/***********************************************************************************************/
/*-- change/dimming the brightness on print dialog window so that white pages doesn`t irritate the eyes --*/
.dialogOverlay {
  background-color: transparent !important;
}

.printPreviewBrowser {
  opacity: 0.9 !important;
}

.previewStack[previewtype="primary"] {
    background: black !important;
}
/***********************************************************************************************/
#context_reloadTab,
#context_shareTabURL,
#context_reopenInContainer,
#context-sep-sendlinktodevice,
#context-sep-copylink,
#context-video-saveimage,
#context-copyimage-contents,
#context-sendimage,
#context-sendvideo,
#context-sendaudio,
#context-sendpagetodevice,
#spell-separator,
#spell-check-enabled,
#spell-add-to-dictionary,
#spell-undo-add-to-dictionary,
#spell-add-dictionaries-main,
#spell-add-dictionaries,
#spell-no-suggestions,
#spell-suggestions-separator,
#context-openlinkprivate,
#context-savelinktopocket,
#context-inspect,
#context-inspect-a11y,
#context-selectall,
#context-bookmarkpage,
#context-viewimage,
#context-viewvideo,
#context-video-pictureinpicture,
#context-openlinkintab,
#context-keywordfield,
#context-print-selection,
#pageActionContextMenu > menuitem[data-l10n-id="page-action-remove-extension"],
#customizationPanelItemContextMenu > .customize-context-removeExtension,
#customizationPanelItemContextMenu > .customize-context-reportExtension,
#customizationPanelItemContextMenuPin,
#customizationPanelItemContextMenuUnpin,
#customizationPanelItemContextMenu > .customize-context-removeFromPanel,
#customizationPanelItemContextMenuUnpin + menuitem + menuseparator,
#context-media-eme-separator,
#context-media-eme-learnmore,
#context-openlink,
#context-bookmarklink,
#context-take-screenshot,
#context_newTab,
#context_toggleMuteTab,
#context_pinTab,
#context_unpinTab,
#context_pinSelectedTabs,
#context_unpinSelectedTabs,
#context_duplicateTab,
#context_selectAllTabs,
#context_selectAllTabs + menuseparator,
#context_closeTabOptions,
#context_closeTab,
#context_moveTabOptions,
#context_bookmarkSelectedTabs,
#context_bookmarkTab { display: none !important;
}
/***********************************************************************************************/
/* MAKES LINK PREVIEW BOTTOM LEFT DARK */
#statuspanel #statuspanel-label, statuspanel .statuspanel-label {
  background: black !important;
  color: var(--lwt-toolbar-field-color, white) !important;
  border-color: var(--panel-separator-color) !important;
}
/***********************************************************************************************/
/*--------------------------- remove stupid fav star in url bar --------------------------*/
#urlbar #star-button{
  display: none !important;
}
/***********************************************************************************************/
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */

#toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container,
#TabsToolbar > .titlebar-buttonbox-container{
  position: fixed;
  display: block;
  top: 0px;
  right:0;
  height: 20px;
}
/* Mac specific. You should set that font-smoothing pref to true if you are on any platform where window controls are on left */
@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){
  .titlebar-buttonbox-container{ left:0; right: unset !important; }
}

:root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container{ height: 32px }

#toolbar-menubar[inactive] > .titlebar-buttonbox-container{ opacity: 0 }

.titlebar-buttonbox-container > .titlebar-buttonbox{ height: 100%; }

#titlebar{
  -moz-box-ordinal-group: 2;
  -moz-appearance: none !important;
  --tabs-navbar-shadow-size: 0px;
  --uc-menubar-vertical-overlap: 19px; /* for hide_tabs_with_one_tab_w_window_controls.css compatibility */
}
/* Re-order window and tab notification boxes */
#navigator-toolbox > div{ display: contents }
.global-notificationbox,
#tab-notification-deck{ -moz-box-ordinal-group: 2 }

#TabsToolbar .titlebar-spacer{ display: none; }
/* Also hide the toolbox bottom border which isn't at bottom with this setup */
#navigator-toolbox::after{ display: none !important; }

@media (-moz-gtk-csd-close-button){ .titlebar-button{ -moz-box-orient: vertical } }
/***********************************************************************************************/
/*--------------------------- change close windows popup colors --------------------------*/
@-moz-document url("chrome://global/content/commonDialog.xhtml"){

  dialog#commonDialog {
    background: #42414d !important;
    color: #fbfbfe !important;
  }

  button[label="Close tabs"] {
    background: red !important;
    color: #fbfbfe !important;
  }

  button[label="Cancel"] {
    background: black !important;
    color: #fbfbfe !important;
  }

  .checkbox-label {
    color: #ff6b6b !important;
  }

}
/***********************************************************************************************/
/*--------------------------- wider tabs --------------------------*/
.tabbrowser-tab[fadein] {
    max-width: 100vw !important;
}
/***********************************************************************************************/
/*--------------------------- remove 1px nasty line below tabs --------------------------*/
#navigator-toolbox {
    border-bottom: 0 !important;
}
/***********************************************************************************************/
.menuitem-iconic.context-menu-add-engine, .menuseparator-add-engine {
    display: none !important;
}
/***********************************************************************************************/
#back-button:not([disabled="true"]),
#forward-button:not([disabled="true"]),
#reload-button:not([disabled="true"]) {
  filter: contrast(100);
}
/***********************************************************************************************/
#contentAreaContextMenu .menu-text, #toolbar-context-menu .menu-text {
  margin-left: -35px !important;
}
/***********************************************************************************************/
.tabbrowser-tab:hover .tab-label-container { color: red; }
/***********************************************************************************************/
/* Moves View Image to the very top */
menuitem[id*="view-image-context-menu-item"] { -moz-box-ordinal-group: 0 !important; }

/* Moves View Video to the very top */
menuitem[id*="view-video-context-menu-item"] { -moz-box-ordinal-group: 0 !important; }

/* Moves View Audio to the very top */
menuitem[id*="view-audio-context-menu-item"] { -moz-box-ordinal-group: 0 !important; }
/***********************************************************************************************/
.autoscroller {
  --autoscroll-background-image: url("autoscroll.svg") display: none !important;
}
/***********************************************************************************************/
.tab-close-button{ margin-inline-end: calc(0px - var(--inline-tab-padding)) !important; }
/***********************************************************************************************/
/* remove padding from window margin in url bar */
#PanelUI-menu-button{
    padding-inline-end: 0px !important;
}
/***********************************************************************************************/
/*** Proton Tabs Tweaks ***/

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

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

    .tab-background {
        border-radius: var(--user-tab-rounding) var(--user-tab-rounding) 0px 0px !important;
        margin-block: 0.5px 0 !important;
    }

/* Inactive tabs: Separator line style */

    .tab-background:not([selected=true]):not([multiselected=true]):not([beforeselected-visible="true"]) {
        border-right: 0.5px solid rgba(21, 20, 26, .20) !important;
    }
    /* For dark backgrounds */
    [brighttext="true"] .tab-background:not([selected=true]):not([multiselected=true]):not([beforeselected-visible="true"]) {
        border-right: 0.5px solid var(--lwt-selected-tab-background-color, rgba(21, 20, 26, .20)) !important;
    }
    .tab-background:not([selected=true]):not([multiselected=true]) {
        border-radius: 0 !important;
    }
    /* Remove padding between tabs */
    .tabbrowser-tab {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

:root {
 --proton-tab-block-margin: 0px 0px !important;
}
/***********************************************************************************************/
.tab-background{ border-top: 0 !important }
/***********************************************************************************************/
.titlebar-spacer[type="post-tabs"]{ display: none }
/***********************************************************************************************/
#personal-bookmarks .bookmark-item,
#bookmarksMenuPopup .bookmark-item { max-width: none !important; }
/***********************************************************************************************/
#PlacesToolbar menupopup[placespopup="true"] {
  --arrowpanel-background: Black !important;
  --arrowpanel-color: White !important;
}
/***********************************************************************************************/
#PlacesToolbarItems toolbarbutton[container="true"]:not([query="true"]) .toolbarbutton-icon,
:-moz-any( #PlacesToolbarItems, #PlacesChevronPopup, #BMB_bookmarksPopup, #bookmarksMenu, #OtherBookmarksPopup ) menu[container="true"]:not([query="true"]) > .menu-iconic-left > .menu-iconic-icon {
    fill: gray !important;
display: none !important;
}
/*----------------------------------------------------------------------------------------------------------*/
#alltabs-button, #new-tab-button, #scrollbutton-up, #tabs-newtab-button, #scrollbutton-down {
    fill: black !important; /*color code here*/
}
/*----------------------------------------------------------------------------------------------------------*/
#appMenu-popup {padding-left: 15px !important;}
/*----------------------------------------------------------------------------------------------------------*/
.sidebar-splitter {display: none !important;}
/*----------------------------------------------------------------------------------------------------------*/
.urlbar-input-box{
  overflow: clip;
}
#urlbar-input{
  margin-left: calc(var(--urlbar-scheme-size) * -0.76) !important;
}
/*----------------------------------------------------------------------------------------------------------*/
:root[uidensity="compact"]{
  --toolbarbutton-inner-padding: 3px !important;
}
/*----------------------------------------------------------------------------------------------------------*/
#context-navigation{ background: transparent !important }
/*----------------------------------------------------------------------------------------------------------*/
/*Useless blue border on tabs fix (DO NOT TOUCH UNLESS YOU DON'T WANT THOSE LITTLE PEKSY TABS COLORED OF BLUE ON BORDERS)*/
#TabsToolbar #firefox-view-button[open] > .toolbarbutton-icon:-moz-lwtheme, .tab-background[selected]:-moz-lwtheme {
    outline:none !important;
}
/*----------------------------------------------------------------------------------------------------------*/
#PlacesToolbar menu.bookmark-item,
#PlacesToolbar menuitem.bookmark-item{
  padding-block: 0px !important;
}
/*----------------------------------- #unified-extensions-button {  display: none !important;} can be potential problem so use this-----------------------------------------------------------------------*/
#unified-extensions-button{
  width: 0.1px;
  padding-inline: 0 !important
}
#unified-extensions-button > .toolbarbutton-icon{
  width: 0 !important;
}
/*----------------------------------------------------------------------------------------------------------*/