/* GNOME CSD styles for headerbar on Firefox [tabsintitlebar] */

@namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

#main-window {
	-moz-appearance: -moz-window-titlebar !important;
	border-radius: 8px 8px 0 0 !important;
}

/* Headerbar top border corners rounded */
:root[tabsintitlebar]:not([inFullscreen]):not([sizemode="maximized"]) #nav-bar {
	border-radius: 8px 8px 0 0 !important;
}

/* Window buttons box */
:root[tabsintitlebar] #titlebar .titlebar-buttonbox-container,
:root[tabsintitlebar] #titlebar-buttonbox-container,
:root[tabsintitlebar][inFullscreen] #window-controls {
	-moz-appearance: none !important;
	padding: 0 0;
	position: absolute !important;
	right: 6px;
	top: 1px;
	display: block !important;
}
:root[tabsintitlebar] #titlebar .titlebar-buttonbox {
	-moz-appearance: none !important;
}

/* Window buttons: at least 1 button */
@media (-moz-gtk-csd-minimize-button), (-moz-gtk-csd-maximize-button), (-moz-gtk-csd-close-button) {
	:root[tabsintitlebar]:not([inFullscreen]) #nav-bar {
		padding-right: 50px !important;
	}
}
/* Window buttons: at least 2 buttons */
@media (-moz-gtk-csd-minimize-button) and (-moz-gtk-csd-maximize-button),
       (-moz-gtk-csd-minimize-button) and (-moz-gtk-csd-close-button),
       (-moz-gtk-csd-maximize-button) and (-moz-gtk-csd-close-button) {
	:root[tabsintitlebar]:not([inFullscreen]) #nav-bar {
		padding-right: 90px !important;
	}
}
/* Window buttons: 3 buttons */
@media (-moz-gtk-csd-minimize-button) and (-moz-gtk-csd-maximize-button) and (-moz-gtk-csd-close-button) {
	:root[tabsintitlebar]:not([inFullscreen]) #nav-bar {
		padding-right: 130px !important;
	}
}

/* Left window buttons */
@media (-moz-gtk-csd-reversed-placement) {
	:root[tabsintitlebar]:not([inFullscreen]) #nav-bar {
		padding-right: 0 !important;
	}
	
	/* Window buttons box */
	:root[tabsintitlebar] #titlebar .titlebar-buttonbox-container {
		left: 6px;
		right: auto;
	}

	/* Window controls: at least 1 button */
	@media (-moz-gtk-csd-minimize-button), (-moz-gtk-csd-maximize-button), (-moz-gtk-csd-close-button) {
		:root[tabsintitlebar]:not([inFullscreen]) #nav-bar {
			padding-left: 50px !important;
		}
	}
	/* Window controls: at least 2 buttons */
	@media (-moz-gtk-csd-minimize-button) and (-moz-gtk-csd-maximize-button),
				 (-moz-gtk-csd-minimize-button) and (-moz-gtk-csd-close-button),
				 (-moz-gtk-csd-maximize-button) and (-moz-gtk-csd-close-button) {
		:root[tabsintitlebar]:not([inFullscreen]) #nav-bar {
			padding-left: 90px !important;
		}
	}
	/* Window controls: 3 buttons */
	@media (-moz-gtk-csd-minimize-button) and (-moz-gtk-csd-maximize-button) and (-moz-gtk-csd-close-button) {
		:root[tabsintitlebar]:not([inFullscreen]) #nav-bar {
			padding-left: 130px !important;
		}
	} 
}

/* Fullscreen headerbar padding for 1 button */
:root[tabsintitlebar][inFullscreen] #nav-bar {
	padding-right: 50px !important;
}

/* Remove close and minimize buttons from fullscreen buttons */
:root[tabsintitlebar][inFullscreen] #window-controls #close-button,
:root[tabsintitlebar][inFullscreen] #window-controls #minimize-button,
:root[tabsintitlebar][inFullscreen] #titlebar .titlebar-buttonbox-container {
	display: none !important;
}

/* Remove tabsbar titlebar blank spaces */
:root[tabsintitlebar] #TabsToolbar .titlebar-placeholder {
	display: none !important;
}

/* Prevent menubar from breaking */
:root[tabsintitlebar] #toolbar-menubar:not([inactive=true]) {
	height: 30px !important;
	margin-bottom: 8px;
}

/* Remove default style of titlebar */
:root[tabsintitlebar] #titlebar {
	-moz-appearance: none !important;
}

/* Fix the issue when dragging tabs */
:root[tabsintitlebar] #navigator-toolbox[movingtab] #TabsToolbar {
	padding-bottom: 0 !important;
}

/* Window buttons style */
:root[tabsintitlebar] #titlebar .titlebar-button,
:root[tabsintitlebar][inFullscreen] #window-controls toolbarbutton {
	-moz-appearance: none !important;
	border: none !important;
	border-radius: 100px !important;
	padding: 0 0 !important;
	height: 24px;
	margin: 0 0 !important;
	width: 24px;
	transition: all .2s ease;
}

:root[tabsintitlebar] #titlebar .titlebar-button {
	height: 24px !important;
	margin: 6px 6px !important;
	width: 24px;
}

:root[tabsintitlebar] #titlebar .titlebar-min:hover,
:root[tabsintitlebar] #titlebar #titlebar-min:hover {
	background: var(--gnome-titlebutton-min-hover-background) !important;
}

:root[tabsintitlebar] #titlebar .titlebar-min:active,
:root[tabsintitlebar] #titlebar #titlebar-min:active {
	background: var(--gnome-titlebutton-min-active-background) !important;
}

:root[tabsintitlebar] #titlebar .titlebar-restore:hover,
:root[tabsintitlebar] #titlebar .titlebar-max:hover,
:root[tabsintitlebar] #titlebar #titlebar-max:hover {
	background: var(--gnome-titlebutton-max-hover-background) !important;
}

:root[tabsintitlebar] #titlebar .titlebar-restore:active,
:root[tabsintitlebar] #titlebar .titlebar-max:active,
:root[tabsintitlebar] #titlebar #titlebar-max:active {
	background: var(--gnome-titlebutton-max-active-background) !important;
}

:root[tabsintitlebar] #titlebar .titlebar-close:hover,
:root[tabsintitlebar] #titlebar #titlebar-close:hover {
	background: var(--gnome-titlebutton-close-hover-background) !important;
}

:root[tabsintitlebar] #titlebar .titlebar-close:active,
:root[tabsintitlebar] #titlebar #titlebar-close:active {
	background: var(--gnome-titlebutton-close-active-background) !important;
}

:root[tabsintitlebar] #titlebar .titlebar-restore:active .toolbarbutton-icon,
:root[tabsintitlebar] #titlebar .titlebar-min:active .toolbarbutton-icon,
:root[tabsintitlebar] #titlebar #titlebar-min:active .toolbarbutton-icon,
:root[tabsintitlebar] #titlebar .titlebar-max:active .toolbarbutton-icon,
:root[tabsintitlebar] #titlebar #titlebar-max:active .toolbarbutton-icon {
	filter: invert(0%) brightness(100%) !important;
}

@media (prefers-color-scheme: dark) {
	:root[tabsintitlebar] #titlebar .titlebar-restore:active .toolbarbutton-icon,
	:root[tabsintitlebar] #titlebar .titlebar-min:active .toolbarbutton-icon,
	:root[tabsintitlebar] #titlebar #titlebar-min:active .toolbarbutton-icon,
	:root[tabsintitlebar] #titlebar .titlebar-max:active .toolbarbutton-icon,
	:root[tabsintitlebar] #titlebar #titlebar-max:active .toolbarbutton-icon {
		filter: invert(100%) brightness(200%) !important;
	}
}

:root[tabsintitlebar] #titlebar .titlebar-close:hover .toolbarbutton-icon,
:root[tabsintitlebar] #titlebar #titlebar-close:hover .toolbarbutton-icon {
	filter: invert(100%) brightness(200%) !important;
}

:root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-button {
	opacity: .4 !important;
}

:root[tabsintitlebar][inFullscreen] #window-controls toolbarbutton {
	height: 38px;
	margin: 0 0 !important;
	width: 38px;
}
