@media (-moz-proton) {
  /** Darkmode - Color lighter ************************************************/
  :root[style*="--lwt-accent-color:rgb(12, 12, 13); --lwt-text-color:rgba(249, 249, 250);"] {
    --toolbar-bgcolor: rgba(43, 42, 51, 5) !important;
  }

  /** Root - Reduce Padding ***************************************************/
  :root {
    /* Tab Bar */
    --proton-tab-block-margin: 2px !important; /* Original: 4px */
    --inline-tab-padding:      6px !important; /* Original: 8px */

    /* Panel */
    --arrowpanel-menuicon-padding: 8px;
    --arrowpanel-menublank-padding: calc(var(--arrowpanel-menuicon-padding) * 2 + 8px);
    --arrowpanel-menuitem-margin: 0 var(--arrowpanel-menuicon-padding) !important; /* Original: 0 8px */
    --arrowpanel-menuitem-padding: 5px  !important; /* Original: 8px */
    --arrowpanel-padding:         0.8em !important; /* Original: 16px or .cui-widget-panel, .cui-widget-panel::part(arrowcontent) => 4px 0 */
    --arowpanel-menuitemblank-padding: calc(var(--arrowpanel-menuitem-padding) - 2px);
  }

  :root[uidensity=compact] {
    /* Tool Bar */
    --toolbarbutton-outer-padding: 2px !important; /* Original: 3px, General is 2px */

    /* Panel */
    --arrowpanel-menuitem-padding: 3px  !important; /* Original: 8px */
  }

  :root[uidensity=touch] {
    /* Tab Bar - Like Original */
    --proton-tab-block-margin: 4px !important; /* Original: 4px */
    --inline-tab-padding:      8px !important; /* Original: 8px */

    /* Panel - Like Original */
    --arrowpanel-menuitem-padding: 8px  !important; /* Original: 8px */
  }

  /** Tab Bar - Reduce Width, Show more tabs **********************************/
  .titlebar-spacer[type="pre-tabs"] {
    width: 30px !important; /* Original: 40px */
  }
  .titlebar-spacer[type="post-tabs"] {
    width: 25px !important; /* Original: 40px */
  }

  :root {
    --newtab-button-minus-width-padding: 2px;
    --newtab-button-width-padding: calc(var(--toolbarbutton-inner-padding) - var(--newtab-button-minus-width-padding));
  }
  #new-tab-button     > .toolbarbutton-icon,
  #alltabs-button     > .toolbarbutton-badge-stack {
    /* Original: calc(2 * var(--toolbarbutton-inner-padding) + 16px) */
    width: calc(2 * var(--newtab-button-width-padding) + 16px) !important;

    /* Original: --toolbarbutton-inner-padding */
    padding-left:  var(--newtab-button-width-padding) !important;
    padding-right: var(--newtab-button-width-padding) !important;
  }

  :root[uidensity=compact] #tabbrowser-tabs[haspinnedtabs]:not([positionpinnedtabs]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab[first-visible-unpinned-tab] {
    margin-inline-start: 0 !important;
  }

  :root:not([uidensity=touch]) #tabbrowser-arrowscrollbox::part(scrollbutton-up  ),
  :root:not([uidensity=touch]) #tabbrowser-arrowscrollbox::part(scrollbutton-down) {
    /* Original: 4px */
    padding-left:  1px !important;
    padding-right: 1px !important;
  }

  :root:not([uidensity=touch]) #new-tab-button, #alltabs-button {
    --toolbarbutton-outer-padding: 1px; /* Original: 2px*/
  }

  /** Tab Bar - Reduce Height, Show more contents *****************************/
  :root:not([uidensity=touch]) #TabsToolbar {
    --toolbarbutton-inner-padding: 9px; /* Original: calc((var(--tab-min-height) - 16px) / 2) = 10px */
  }

  .toolbar-items, .tabbrowser-tab {
    max-height: 38px;
  }
  :root[uidensity=compact] .toolbar-items, .tabbrowser-tab {
    max-height: 36px;
  }
  :root[uidensity=touch] .toolbar-items, .tabbrowser-tab {
    max-height: unset;
  }

  :root:not([uidensity=touch]) #tabbrowser-arrowscrollbox::part(scrollbutton-up),
  :root:not([uidensity=touch]) #tabbrowser-arrowscrollbox::part(scrollbutton-down) {
    /* Original: var(--toolbarbutton-inner-padding) calc(var(--toolbarbutton-inner-padding) - 6px) = 9px */
    padding-top:    3px !important;
    padding-bottom: 3px !important;
  }

  /* Tab - Max Size */
  :root:not([uidensity=touch]) .tabbrowser-tab[fadein]:not([pinned]):not([style*="max-width"]) {
    max-width: 240px !important;
  }

  /* Tab - Connect to window */
  .tab-background {
    border-radius: var(--tab-border-radius) var(--tab-border-radius) 0px 0px !important;
    margin-bottom: 0px !important;
  }

  .tab-content {
    margin-top: var(--proton-tab-block-margin);
  }

  .tab-stack {
    margin-top:    0px !important;
    margin-bottom: 0px !important;
  }

  /* neighbouring tabs should "pinch" together */
  .tabbrowser-tab {
    padding-inline: 1px !important;
  }

  .tabbrowser-tab:not([last-visible-tab]) {
    margin-inline-end: -.5px !important;
  }

  /** Selected Tab - Color like toolbar ***************************************/
  #tabbrowser-tabs:not([movingtab]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab > .tab-stack > .tab-background[multiselected="true"]:-moz-lwtheme, #tabbrowser-tabs:not([movingtab]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab > .tab-stack > .tab-background[selected="true"]:-moz-lwtheme {
    background-image: linear-gradient(var(--toolbar-bgcolor, transparent), var(--toolbar-bgcolor, transparent)), linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), var(--lwt-header-image, none) !important;
  }

  /* Selected Tab - Box Shadow */
  #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab:is([visuallyselected="true"],
  [multiselected]) > .tab-stack > .tab-background:-moz-lwtheme {
    box-shadow: 0 0 1px var(--toolbar-color) !important;
  }

  /** Unselected Tab - Divide line ********************************************/
  .tab-content::before,
  .tab-content::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    background-color: var(--toolbarseparator-color) !important;
    width: 1px !important;
    height: 20px !important;
    transform: translateY(-10px) !important;
    opacity: 0 !important;
    transition: opacity .2s var(--ease-basic) !important;
  }

  .tab-content::before {
    left: 0 !important;
  }
  .tab-content::after {
    right: 0 !important;
  }

  .tabbrowser-tab[visuallyselected][style*=transform] + .tabbrowser-tab[style*=transform] .tab-content::after,
  .tabbrowser-tab[style*=transform]:not([visuallyselected]) .tab-content::before,
  .tabbrowser-tab[style*=transform] + .tabbrowser-tab:not([visuallyselected]) .tab-content::before,
  .tabbrowser-tab:not([visuallyselected]):not(:hover):not([multiselected]) + .tabbrowser-tab:not([visuallyselected]):not(:hover):not([multiselected]) .tab-content::before,
  #tabbrowser-tabs[hasadjacentnewtabbutton]:not([overflow]) .tabbrowser-tab[last-visible-tab]:not([visuallyselected]):not(:hover):not([multiselected]) .tab-content::after
  {
    opacity: var(--tab-separator-opacity) !important;
  }

  /** Clipped tabs - Letters cleary *******************************************/
  #tabbrowser-tabs[closebuttons=activetab] .tab-content:not([pinned])
  {
    padding-inline-start: 8px !important;
  }

  #tabbrowser-tabs[closebuttons=activetab] .tabbrowser-tab:not([visuallyselected]) .tab-close-button {
    visibility: collapse !important;
  }

  #tabbrowser-tabs[closebuttons=activetab] .tab-label-container[textoverflow][labeldirection="ltr"]:not([pinned]),
  #tabbrowser-tabs[closebuttons=activetab] .tab-label-container[textoverflow]:not([labeldirection]):-moz-locale-dir(ltr):not([pinned])
  {
    mask-image: linear-gradient(to right, black 70%, transparent) !important;
  }

  #tabbrowser-tabs[closebuttons=activetab] .tab-label-container[textoverflow][labeldirection="rtl"]:not([pinned]),
  #tabbrowser-tabs[closebuttons=activetab] .tab-label-container[textoverflow]:not([labeldirection]):-moz-locale-dir(rtl):not([pinned])
  {
    mask-image: linear-gradient(to left, black 70%, transparent) !important;
  }

  /** Sound Tab - Show with Favicons ******************************************/
  /* Makes the favicons always visible (also on hover) */
  #tabbrowser-tabs[secondarytext-unsupported] .tab-icon-stack:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) > :not(.tab-icon-overlay), #toolbar-menubar:not(:hover) + #TabsToolbar:not(:hover) #tabbrowser-tabs:not([secondarytext-unsupported]) .tab-icon-image[src] ~ .tab-icon-overlay:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]),
  :is(#toolbar-menubar:hover + #TabsToolbar, #TabsToolbar:hover) .tab-icon-stack:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) > :not(.tab-icon-overlay)
  {
    opacity: 1 !important;
  }

  /* Makes the speaker icon to always appear if the tab is playing (not only on hover) */
  .tab-icon-overlay:not([crashed]) {
    top: -4.5px !important;
    inset-inline-end: -9px !important;
    z-index: 1 !important;
    background: transparent !important;
  }
  .tab-icon-overlay:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) {
    opacity: 1 !important;
    margin-right: 10px !important;
  }

  /** URL Bar - Reduce Padding ************************************************/
  :root:not([uidensity=touch]) #urlbar-container, #search-container {
    padding-block: 2px; /* Original: 4px */
    margin-inline: 5px; /* Original: 5px */
  }

  /* spread menu */
  :root[uidensity=compact] .urlbarView-row:not([type=tip], [type=dynamic]) {
    padding-block: 1px; /* [Compact, General]: 2px, Touch: 11px */
  }
  :root[uidensity=compact] #urlbar .search-one-offs:not([hidden]) {
    padding-block: 2px; /* [Compact, General]: 4px, Touch 11px */
  }

  /** BookMark Bar - Reduce Height ********************************************/
  :root[uidensity=compact] #PersonalToolbar toolbarbutton {
      margin-top: 0px; /* Original: 2px */
  }

  /** 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]) .menupopup-arrowscrollbox {
    padding-block: 1px !important; /* Original: 4px*/
  }
  :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 */
  }

  /** Panel - Icons ***********************************************************/
  /* Padding */
  .subviewbutton > .toolbarbutton-text {
    padding-inline-start: var(--arrowpanel-menuicon-padding);
  }
  #appMenu-proton-update-banner .toolbarbutton-text {
    margin-inline-start: 0;
  }
  #appMenu-multiView .subviewbutton::before,
  #appMenu-proton-update-banner::before {
    display: -moz-inline-box;
    margin-right: var(--arrowpanel-menuicon-padding);
    width:  16px;
    height: 16px;
  }
  #appMenu-proton-update-banner {
    margin-bottom: 2px;
  }
  #appMenu-fxa-status2,
  #appMenu-zoom-controls2 {
    padding-top:    var(--arowpanel-menuitemblank-padding) !important;
    padding-bottom: var(--arowpanel-menuitemblank-padding) !important;
  }

  /* Icons Color */
  #appMenu-multiView .subviewbutton::before,
  #appMenu-proton-update-banner::before,
  .subviewbutton > image {
    -moz-context-properties: fill;
    fill: currentColor;
    fill-opacity: var(--toolbarbutton-icon-fill-opacity);
  }

  /* Panel - Main */
  #appMenu-proton-update-banner::before {
    content: url(chrome://browser/skin/whatsnew.svg);
  }
  #appMenu-fxa-status2::before { /* Don't exist img tag */
    content: url(chrome://browser/skin/fxa/avatar-empty.svg);
  }

  #appMenu-new-tab-button2 {
    list-style-image: url(chrome://browser/skin/new-tab.svg);
  }
  #appMenu-new-window-button2 {
    list-style-image: url(chrome://browser/skin/window.svg);
  }
  #appMenu-new-private-window-button2 {
    list-style-image: url(chrome://browser/skin/privateBrowsing.svg);
  }

  #appMenu-bookmarks-button{
    list-style-image: url(chrome://browser/skin/bookmark.svg);
  }
  #appMenu-history-button {
    list-style-image: url(chrome://browser/skin/history.svg);
  }
  #appMenu-downloads-button {
    list-style-image: url(chrome://browser/skin/downloads/downloads.svg);
  }
  #appMenu-passwords-button {
    list-style-image: url(chrome://browser/skin/login.svg);
  }
  #appMenu-extensions-themes-button {
    list-style-image: url(chrome://mozapps/skin/extensions/extension.svg);
  }

  #appMenu-print-button2 {
    list-style-image: url(chrome://global/skin/icons/print.svg);
  }
  #appMenu-save-file-button2 {
    list-style-image: url(chrome://browser/skin/save.svg);
  }
  #appMenu-find-button2 {
    list-style-image: url(chrome://global/skin/icons/search-glass.svg);
  }
  #appMenu-zoom-controls2::before {
    content: url(./icons/screenshot.svg);
  }

  #appMenu-settings-button {
    list-style-image: url(chrome://global/skin/icons/settings.svg);
  }
  #appMenu-more-button2 {
    list-style-image: url(chrome://browser/skin/ion.svg);
  }
  #appMenu-help-button2 {
    list-style-image: url(chrome://global/skin/icons/help.svg);
  }

  #appMenu-quit-button2 {
    list-style-image: url(chrome://browser/skin/quit.svg);
  }

  /* Panel - Bookmark */
  #panelMenuBookmarkThisPage {
    list-style-image: url(chrome://browser/skin/bookmark-hollow.svg);
  }
  panelMenuBookmarkThisPage[starred] {
    list-style-image: url(chrome://browser/skin/bookmark.svg);
  }

  #panelMenu_searchBookmarks {
    list-style-image: url(chrome://global/skin/icons/search-glass.svg);
  }
  #panelMenu_viewBookmarksToolbar {
    list-style-image: url(chrome://browser/skin/bookmarks-toolbar.svg);
  }

  #panelMenu_showAllBookmarks {
    list-style-image: url(chrome://browser/skin/bookmark-star-on-tray.svg);
  }

  /* Panel - History */
  #appMenuRecentlyClosedTabs {
    list-style-image: url(chrome://browser/skin/tab.svg);
  }
  #appMenuRecentlyClosedWindows {
    list-style-image: url(chrome://browser/skin/window.svg);
  }
  #appMenuRestoreLastSession {
    list-style-image: url(chrome://browser/skin/restore-session.svg);
  }
  #appMenuClearRecentHistory {
    list-style-image: url(chrome://browser/skin/forget.svg);
  }

  #PanelUI-historyMore {
    list-style-image: url(chrome://browser/skin/history.svg);
  }

  /* Panel - More tools */
  #appmenu-moreTools-button {
    list-style-image: url(chrome://browser/skin/customize.svg);
  }

  #appmenu-developer-tools-view  .subviewbutton:nth-child(1) { /* Web Developer Tools */
    list-style-image: url(chrome://browser/skin/developer.svg);
  }
  #appmenu-developer-tools-view  .subviewbutton:nth-child(2) { /* Task Manager */
    list-style-image: url(chrome://global/skin/icons/performance.svg);
  }
  #appmenu-developer-tools-view  .subviewbutton:nth-child(3) { /* Remote Debugging - Edge bug.svg */
    list-style-image: url(./icons/bug.svg);
  }
  #appmenu-developer-tools-view  .subviewbutton:nth-child(4) { /* Browser Toolbox - Edge webdeveloper.svg */
    list-style-image: url(./icons/webdeveloper.svg);
  }
  #appmenu-developer-tools-view  .subviewbutton:nth-child(5) { /* Browser Content Toolbaox -  */
    list-style-image: url(chrome://devtools/skin/images/command-frames.svg);
  }
  #appmenu-developer-tools-view  .subviewbutton:nth-child(6) { /* Browser Console */
    list-style-image: url(chrome://devtools/skin/images/command-console.svg);
  }
  #appmenu-developer-tools-view  .subviewbutton:nth-child(7) { /* Responsive Design Mode */
    list-style-image: url(chrome://devtools/skin/images/command-responsivemode.svg);
  }
  #appmenu-developer-tools-view  .subviewbutton:nth-child(8) { /* Eyedropper */
    list-style-image: url(chrome://devtools/skin/images/command-eyedropper.svg);
  }
  #appmenu-developer-tools-view  .subviewbutton:nth-child(9) { /* Page Source - Edge file-search.svg */
    list-style-image: url(./icons/search-file.svg);
  }
  #appmenu-developer-tools-view  .subviewbutton:nth-child(10) { /* Extensions for Devel */
    list-style-image: url(chrome://devtools/skin/images/debugging-addons.svg);
  }

  /* Panel - Help */
  #appMenu_menu_openHelp {
    list-style-image: url(chrome://global/skin/icons/help.svg);
  }
  #appMenu_feedbackPage {
    list-style-image: url(./icons/send.svg);
  }
  #appMenu_helpSafeMode {
    list-style-image: url(chrome://devtools/skin/images/debugging-workers.svg);
  }
  #appMenu_troubleShooting {
    list-style-image: url(chrome://global/skin/icons/more.svg);
  }
  #appMenu_help_reportSiteIssue {
    list-style-image: url(chrome://global/skin/icons/lightbulb.svg);
  }
  #appMenu_menu_HelpPopup_reportPhishingtoolmenu {
    list-style-image: url(chrome://global/skin/icons/warning.svg);
  }
  #appMenu_aboutName{
    list-style-image: url(chrome://global/skin/icons/info.svg);
  }
}