:-moz-any(.titlebar-placeholder, .titlebar-spacer)[type=pre-tabs]
{
	width: 0 !important;
}

@media (-moz-mac-yosemite-theme)
{
	#TabsToolbar
	{
		-moz-appearance: none !important;
		padding-left: 10px !important;
		padding-right: 12px;
	}
	
	#titlebar-buttonbox-container {
		margin-left: 8px; /* Adds space between the tabs and the buttons */
	}
	
	:root:-moz-any([inFullscreen], [tabsintitlebar]):not([privatebrowsingmode=temporary]) #TabsToolbar:not(:-moz-lwtheme)
	{
		background-color: #dee1e5 !important;
		color: #606367 !important;
		--toolbarbutton-hover-background: #cbced2 !important;
		--toolbarbutton-active-background: #bec0c5 !important;
		padding-left: 10px !important;
	}
	
	:root:-moz-any([inFullscreen], [tabsintitlebar]):not([privatebrowsingmode=temporary]) #TabsToolbar:not(:-moz-lwtheme):-moz-window-inactive
	{
		background-color: #e7eaed !important;
		padding-left: 10px !important;
	}
	
	:-moz-any(.titlebar-placeholder, .titlebar-spacer)[type=pre-tabs]
	{
		width: 4px !important;
	}
}

@media (-moz-platform: windows-win7)
{
	:root:not([privatebrowsingmode=temporary]) #TabsToolbar:not(:-moz-lwtheme)
	{
		color: #808387 !important;
		--toolbarbutton-hover-background: rgba(196, 198, 204, .8) !important;
		--toolbarbutton-active-background: #bec0c6 !important;
	}
	
	:root:not([privatebrowsingmode=temporary]) #TabsToolbar toolbarbutton:not(:-moz-lwtheme):not(:hover):not([open])
	{
		background-color: rgba(218, 220, 227, .8) !important;
	}
	
	:root:not([privatebrowsingmode=temporary]) .tabbrowser-tab:not([visuallyselected]):not(:-moz-lwtheme)
	{
		--tab-bgcolor: rgb(218, 220, 227) !important;
		--tab-opacity: .8 !important;
	}
	
	:root:not([privatebrowsingmode=temporary]) .tabbrowser-tab:hover:not([visuallyselected]):not(:-moz-lwtheme)
	{
		--tab-bgcolor: #e9ebef !important;
	}
}

:root[privatebrowsingmode] #TabsToolbar
{
	color: #808387 !important;
}

 /* < FF 65, >= FF 65 */
:-moz-any(.titlebar-placeholder, .titlebar-spacer)
{
	border: 0 !important;
	display: -moz-box !important;
}

:-moz-any(.titlebar-placeholder, .titlebar-spacer)[type=post-tabs]
{
	width: 48px !important;
	transition: width .666s cubic-bezier(.4, 0, .2, 1) !important;
}

@media (max-width: 700px)
{
	:-moz-any(.titlebar-placeholder, .titlebar-spacer)[type=post-tabs]
	{
		width: 8px !important;
	}
}

:root[privatebrowsingmode] #TabsToolbar
{
	background-color: var(--lwt-accent-color-inactive, var(--lwt-accent-color)) !important;
}

/* vertically center buttons in tab bar */
#TabsToolbar toolbarbutton,
#TabsToolbar .toolbar-items toolbarbutton.toolbarbutton-1,
/* >= 72 */
#TabsToolbar .tabbrowser-arrowscrollbox::part(scrollbutton-up),
#TabsToolbar .tabbrowser-arrowscrollbox::part(scrollbutton-down),
/* no ::part workaround - may have side effects */
#scrollbutton-up[part="scrollbutton-up"]:not(.menupopup-scrollbutton),
#scrollbutton-down[part="scrollbutton-down"]:not(.menupopup-scrollbutton)
{
	margin-top: calc(var(--tab-shadow-max-size) + 3px) !important;
	margin-bottom: 1px !important;
}

.tabbrowser-tab
{
	min-height: var(--tab-min-height) !important;
	overflow: visible !important;
	font-size: 12px !important;
	background: 0 !important;
	border: 0 !important;
	padding: 0 !important;
	margin-top: 2px;
}
.tabbrowser-tab:first-of-type {
    padding-left: 8px !important;  /* Adjust this value for desired spacing */
}
#tabbrowser-tabs > .tabbrowser-tab:first-of-type {
    margin-left: 8px !important; /* Adds left margin to the first tab only */
}

.tabbrowser-tab[visuallyselected]
{
	color: var(--toolbar-color) !important;
}

/* regular */
.tabbrowser-tab[fadein]:not([pinned]):not([style*="max-width"])
{
	max-width: 240px !important;
}

/* neighbouring tabs should "pinch" together */
.tabbrowser-tab:not([last-visible-tab])
{
	margin-inline-end: -.5px !important;
}

/* special case for pinned tabs when overflowing */
#tabbrowser-tabs:not([overflow]) .tabbrowser-tab:not([first-visible-tab]),
#tabbrowser-tabs[overflow] .tabbrowser-tab:not([first-visible-tab]):not([pinned])
{
	margin-inline-start: -.5px !important;
}

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

#tabbrowser-tabs[overflow] .tabbrowser-tab[pinned] .tab-background
{
	margin: 0 -1px !important;
}

#tabbrowser-tabs[overflow] .tabbrowser-tab[pinned] .tab-stack
{
	margin-top: 8px !important;
	margin-bottom: 0 !important;
}

.tab-content
{
	position: relative !important;
	overflow: hidden !important;
	padding-inline-start: 12px !important;
	padding-inline-end: 8px !important;
}

.tab-content::before,
.tab-content::after
{
	content: "" !important;
	display: block !important;
	position: absolute !important;
	background-color: currentColor !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;
}

.tab-throbber,
.tab-throbber-fallback,
.tab-icon-image,
.tab-sharing-icon-overlay,
.tab-icon-sound,
.tab-close-button
{
	margin-top: 0 !important;
}

.tabbrowser-tab::before,
.tabbrowser-tab::after,
.tab-line
{
	display: none !important;
}

/* tab background color */

.tabbrowser-tab
{
	--tab-opacity: 0;
	--tab-bgcolor: #000;
	--tab-transition-duration: .2s;
}

:-moz-any(:root[privatebrowsingmode=temporary], #TabsToolbar[brighttext]) .tabbrowser-tab
{
	--tab-opacity: 0;
	--tab-bgcolor: #fff;
}

.tabbrowser-tab:not([selected=true]):hover,
.tabbrowser-tab[multiselected]:not([selected=true])
{
	--tab-opacity: .1;
}

:-moz-any(:root[privatebrowsingmode=temporary], #TabsToolbar[brighttext]) .tabbrowser-tab:not([selected=true]):hover,
:-moz-any(:root[privatebrowsingmode=temporary], #TabsToolbar[brighttext]) .tabbrowser-tab[multiselected]:not([selected=true])
{
	--tab-opacity: .06;
}

:-moz-any(#TabsToolbar) .tabbrowser-tab[visuallyselected]
{
	--tab-bgcolor: var(--toolbar-bgcolor);
	--tab-opacity: 1;
}

.tab-background
{
 	background: var(--tab-bgcolor) !important;
	/* rounded top corners */
	border-radius: 8px 8px 0 0 !important;
	position: relative !important;
	border: 0 !important;
	transition:
		opacity var(--tab-transition-duration) var(--ease-basic),
		background-color 0s var(--tab-transition-duration) var(--ease-basic) !important;
	opacity: var(--tab-opacity) !important;
	visibility: visible !important;
	box-shadow: none !important;
	outline: none !important;
}

/* rounded bottom corners */
.tab-background::before,
.tab-background::after
{
	content: "" !important;
	display: block !important;
	position: absolute !important;
	width: 8px !important;
	height: 8px !important;
	bottom: 0 !important;
	pointer-events: none !important;
	transition: box-shadow 0s var(--tab-transition-duration) var(--ease-basic) !important;
	clip-path: inset(0) !important;
}

.tab-background::before
{
	border-bottom-right-radius: 8px !important;
	left: 0 !important;
	transform: translateX(-8px) !important;
	box-shadow: 4px 4px 0 4px var(--tab-bgcolor) !important;
}

.tab-background::after
{
	border-bottom-left-radius: 8px !important;
	right: 0 !important;
	transform: translateX(8px) !important;
	box-shadow: -4px 4px 0 4px var(--tab-bgcolor) !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;
}

#tabbrowser-tabs[overflow] .tabbrowser-tab[pinned] + .tabbrowser-tab:not([pinned]) .tab-content::before
{
	opacity: 0 !important;
}

.tabbrowser-tab[visuallyselected]
{
	--tab-transition-duration: 0s;
}

.tab-throbber,
.tab-throbber-fallback
{
	margin-inline-end: 8px !important;
}

.tab-icon-image
{
	margin: 0 !important;
}

/* hide new tab favicon */
.tabbrowser-tab[image^="chrome://branding/"]:not([pinned]) .tab-icon-image
{
	display: none !important;
}

.tab-label-container
{
	margin-top: -2px !important;
	opacity: 1 !important;
}

.tabbrowser-tab[image]:not([image^="chrome://branding/"]) .tab-label-container,
.tabbrowser-tab:-moz-any([progress], [busy]) .tab-label-container
{
	padding-inline-start: 8px !important;
}

.tabbrowser-tab:-moz-any([soundplaying], [muted], [activemedia-blocked]):not([pinned]) .tab-icon-image
{
	visibility: hidden !important;
}

.tab-icon-sound-label
{
	display: none !important;
}

.tabbrowser-tab[fadein] .tab-close-button
{
	visibility: visible !important;
}

.tab-close-button
{
	list-style-image: url(close-tab.svg) !important;
	width: 16px !important;
	height: 16px !important;
	margin: 0 !important;
	padding: 0 !important;
}

.tab-close-button,
.tab-icon-overlay:-moz-any([soundplaying], [muted], [activemedia-blocked]),
.tab-icon-sound
{
	border-radius: 99px !important;
	color: inherit !important;
	-moz-context-properties: fill, fill-opacity !important;
	transition-property: fill-opacity, background-color !important;
	transition-duration: .15s !important;
	transition-timing-function: var(--ease-basic) !important;
	fill-opacity: 1 !important;
	opacity: 1 !important;
}

.tab-close-button:hover,
.tab-icon-overlay:-moz-any([soundplaying], [muted], [activemedia-blocked]):hover,
.tab-icon-sound:hover
{
	background-color: var(--toolbarbutton-hover-background) !important;
}

.tab-close-button:hover:active,
.tab-icon-overlay:-moz-any([soundplaying], [muted], [activemedia-blocked]):hover:active,
.tab-icon-sound:hover:active
{
	background-color: var(--toolbarbutton-active-background) !important;
}

.tab-icon-overlay[pinned]
{
	margin: 0 !important;
	margin-inline-start: -16px !important;
}

.tab-sharing-icon-overlay
{
	margin-inline-start: -16px !important;
}

@keyframes rotate-360
{
	0% { transform: rotate(0); }
	100% { transform: rotate(1turn); }
}

.tab-throbber
{
	-moz-context-properties: fill !important;
	fill: currentColor !important;
	background-image: url(spinner-busy.svg) !important;
	margin: 0 !important;
	transform-origin: center !important;
	animation: rotate-360 1.333s linear infinite reverse !important;
	position: static !important;
}

.tab-throbber[progress]
{
	background-image: url(spinner-progress.svg) !important;
	animation-direction: normal !important;
}

.tab-throbber::before
{
	display: none !important;
}

/* clipped tabs */
#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;
}

.tab-content[pinned]
{
	-moz-box-pack: center !important;
}

.tab-icon-image[pinned],
.tab-throbber[pinned]
{
	margin: auto !important;
}

.tab-content[pinned]
{
	width: 36px !important;
	padding: 0 !important;
	padding-inline-start: 10px !important;
	padding-inline-end: 0 !important;
}

.tab-label-container[pinned],
.tab-close-button[pinned]
{
	visibility: hidden !important;
} 

/* close button / favicon is centered within 36px tab */
/* disabled for now because it's broken in recent version of Firefox */
@supports -moz-bool-pref("materialFox.reduceTabOverflow disabled")
{
	#main-window
	{
		/* same as Chrome */
		min-width: 500px !important;
	}
	
	#tabbrowser-tabs[overflow] .tab-content
	{
		-moz-box-pack: center !important;
	}
	
	#tabbrowser-tabs[overflow] .tab-icon-image
	{
		margin: auto !important;
	}
	
	#tabbrowser-tabs[overflow] .tab-content[image]:not([image^="chrome://branding/"]):not([pinned])
	{
		width: 36px !important;
		padding: 0 !important;
		padding-inline-start: 0 !important;
		padding-inline-end: 0 !important;
	}
	
	#tabbrowser-tabs[overflow] .tabbrowser-tab:not([visuallyselected]):not([pinned]) .tab-close-button,
	#tabbrowser-tabs[overflow] .tabbrowser-tab[visuallyselected]:not([pinned]) :-moz-any(.tab-label-container, .tab-icon-image),
	#tabbrowser-tabs[overflow] .tabbrowser-tab[image]:not([image^="chrome://branding/"]):not([pinned]) .tab-label-container
	{
		display: none !important;
	} 
}

#tabbrowser-tabs #tabs-newtab-button
{
	margin-inline-start: 6px !important;
}

#tabbrowser-tabs[overflow] .tabbrowser-arrowscrollbox
{
	border-radius: 8px 8px 0 0 !important;
	background-color: rgba(0, 0, 0, .1) !important;
	padding-inline-start: 0 !important;
}

#tabbrowser-tabs[overflow]
{
	margin-inline-start: 8px !important;
}

#tabbrowser-tabs[overflow] .tabbrowser-tab[first-visible-tab]:not([pinned]),
#tabbrowser-tabs[overflow] .tabbrowser-tab[pinned] + .tabbrowser-tab:not([pinned]),
#tabbrowser-tabs:not([overflow]) .tabbrowser-tab[first-visible-tab]
{
	margin-inline-start: 8px !important;
}

#tabbrowser-tabs[overflow] .tabbrowser-tab[last-visible-tab]:not([pinned])
{
	margin-inline-end: 8px !important;
}

.tabbrowser-tab[usercontextid] > .tab-stack::after
{
	content: "" !important;
	position: absolute !important;
	display: flex !important;
	bottom: calc(100% - 12px) !important;
	left: calc(100% - 9px) !important;
	width: 6px !important;
	height: 6px !important;
	border-radius: 99px !important;
	box-sizing: border-box !important;
	transform: none !important;
	background: var(--identity-tab-color) !important;
	transition-property: top, bottom, left, right, width, height, border-radius;
	transition-duration: .225s !important;
	transition-timing-function: var(--ease-out) !important;
}

.tab-context-line {
	visibility: hidden !important;
}

.tab-bottom-line
{
	display: none !important;
}

/* < 72 */
#tabbrowser-tabs .arrowscrollbox-overflow-start-indicator,
#tabbrowser-tabs .arrowscrollbox-overflow-end-indicator,
/* >= 72 */
#tabbrowser-tabs::part(arrowscrollbox-overflow-start-indicator),
#tabbrowser-tabs::part(arrowscrollbox-overflow-end-indicator),
/* no ::part workaround - may have side effects */
spacer[part="overflow-start-indicator"],
spacer[part="overflow-end-indicator"]
{
	display: none !important;
}

.tab-loading-burst[bursting]::before
{
	display: none !important;
}

/* high DPI adjustments */
@media (min--moz-device-pixel-ratio: 2)
{
	.tabbrowser-tab::before
	{
		transform: translateY(.5px) !important;
	}

	.tabbrowser-tab:last-of-type::after
	{
		transform: translate(-1px, .5px) !important;
	}
	
	/* macOS */
	@media (-moz-mac-yosemite-theme)
	{
		.titlebar-buttonbox
		{
			margin-top: .5px !important;
			margin-bottom: -.5px !important;
		}
	}
}
