.tabbrowser-tab {
	appearance: none;
	background-color: var(--vtr-tab-background-color);
	background: var(--vtr-tab-background);
	font-size: var(--vtr-tab-font-size);
	font-weight: var(--vtr-tab-font-weight);
	text-shadow: var(--vtr-tab-text-shadow);
	margin: var(--vtr-tab-margin-top) var(--vtr-tab-margin-right) var(--vtr-tab-margin-bottom) var(--vtr-tab-margin-left);
	padding: var(--vtr-tab-padding-top) var(--vtr-tab-padding-right) var(--vtr-tab-padding-bottom) var(--vtr-tab-padding-left);
	height: var(--vtr-tab-height);
	min-height: var(--vtr-tab-min-height);
	max-height: var(--vtr-tab-max-height);
	color: var(--vtr-tab-text-color);
	border-radius: var(--vtr-tab-border-radius);
	border-top: var(--vtr-tab-border-top-width) var(--vtr-tab-border-top-style) var(--vtr-tab-border-top-color);
	border-right: var(--vtr-tab-border-right-width) var(--vtr-tab-border-right-style) var(--vtr-tab-border-right-color);
	border-bottom: var(--vtr-tab-border-bottom-width) var(--vtr-tab-border-bottom-style) var(--vtr-tab-border-bottom-color);
	border-left: var(--vtr-tab-border-left-width) var(--vtr-tab-border-left-style) var(--vtr-tab-border-left-color);
}

.tabbrowser-tab .tab-buttons
{
	background-color: var(--vtr-tab-background-color);
}

/*
 * 	Pinned tabs
 */
.tabbrowser-tab[pinned] {
	margin: var(--vtr-tab-pinned-margin-top) var(--vtr-tab-pinned-margin-right) var(--vtr-tab-pinned-margin-bottom) var(--vtr-tab-pinned-margin-left);
	padding: var(--vtr-tab-pinned-padding-top) var(--vtr-tab-pinned-padding-right) var(--vtr-tab-pinned-padding-bottom) var(--vtr-tab-pinned-padding-left);
	color: var(--vtr-tab-pinned-text-color);
	background-color: var(--vtr-tab-pinned-background-color);
	background: var(--vtr-tab-pinned-background);
	font-weight: var(--vtr-tab-pinned-font-weight);
	text-shadow: var(--vtr-tab-pinned-text-shadow);
	border-radius: var(--vtr-tab-pinned-border-radius);
	border-top: var(--vtr-tab-pinned-border-top-width) var(--vtr-tab-pinned-border-top-style) var(--vtr-tab-pinned-border-top-color);
	border-right: var(--vtr-tab-pinned-border-right-width) var(--vtr-tab-pinned-border-right-style) var(--vtr-tab-pinned-border-right-color);
	border-bottom: var(--vtr-tab-pinned-border-bottom-width) var(--vtr-tab-pinned-border-bottom-style) var(--vtr-tab-pinned-border-bottom-color);
	border-left: var(--vtr-tab-pinned-border-left-width) var(--vtr-tab-pinned-border-left-style) var(--vtr-tab-pinned-border-left-color);
}

.tabbrowser-tab[pinned] .tab-buttons
{
	background-color: var(--vtr-tab-pinned-background-color);
}

.tabbrowser-tab[pinned][selected="true"] {
	margin: var(--vtr-tab-pinned-selected-margin-top) var(--vtr-tab-pinned-selected-margin-right) var(--vtr-tab-pinned-selected-margin-bottom) var(--vtr-tab-pinned-selected-margin-left);
	padding: var(--vtr-tab-pinned-selected-padding-top) var(--vtr-tab-pinned-selected-padding-right) var(--vtr-tab-pinned-selected-padding-bottom) var(--vtr-tab-pinned-selected-padding-left);
	color: var(--vtr-tab-pinned-selected-text-color);
	background-color: var(--vtr-tab-pinned-selected-background-color);
	background: var(--vtr-tab-pinned-selected-background);
	font-weight: var(--vtr-tab-pinned-selected-font-weight);
	text-shadow: var(--vtr-tab-pinned-selected-text-shadow);
	border-radius: var(--vtr-tab-pinned-selected-border-radius);
	border-top: var(--vtr-tab-pinned-selected-border-top-width) var(--vtr-tab-pinned-selected-border-top-style) var(--vtr-tab-pinned-selected-border-top-color);
	border-right: var(--vtr-tab-pinned-selected-border-right-width) var(--vtr-tab-pinned-selected-border-right-style) var(--vtr-tab-pinned-selected-border-right-color);
	border-bottom: var(--vtr-tab-pinned-selected-border-bottom-width) var(--vtr-tab-pinned-selected-border-bottom-style) var(--vtr-tab-pinned-selected-border-bottom-color);
	border-left: var(--vtr-tab-pinned-selected-border-left-width) var(--vtr-tab-pinned-selected-border-left-style) var(--vtr-tab-pinned-selected-border-left-color);
}

.tabbrowser-tab[pinned][selected="true"] .tab-buttons
{
	background-color: var(--vtr-tab-pinned-selected-background-color);
}

.tabbrowser-tab[pinned]:not([selected="true"]):hover {
	margin: var(--vtr-tab-pinned-hover-margin-top) var(--vtr-tab-pinned-hover-margin-right) var(--vtr-tab-pinned-hover-margin-bottom) var(--vtr-tab-pinned-hover-margin-left);
	padding: var(--vtr-tab-pinned-hover-padding-top) var(--vtr-tab-pinned-hover-padding-right) var(--vtr-tab-pinned-hover-padding-bottom) var(--vtr-tab-pinned-hover-padding-left);
	background-color: var(--vtr-tab-pinned-hover-background-color);
	background: var(--vtr-tab-pinned-hover-background);
}

.tabbrowser-tab[pinned]:not([selected="true"]):hover .tab-buttons
{
	background-color: var(--vtr-tab-pinned-hover-background-color);
}

.tabbrowser-tab[pinned].hover-before
{
	border-top: var(--vtr-tab-hover-border-top);
}
.tabbrowser-tab[pinned].hover-after
{
	border-bottom: var(--vtr-tab-hover-border-bottom);
}

/*
 * 	Selected tabs
 */
.tabbrowser-tab[selected="true"] {
	margin: var(--vtr-tab-selected-margin-top) var(--vtr-tab-selected-margin-right) var(--vtr-tab-selected-margin-bottom) var(--vtr-tab-selected-margin-left);
	padding: var(--vtr-tab-selected-padding-top) var(--vtr-tab-selected-padding-right) var(--vtr-tab-selected-padding-bottom) var(--vtr-tab-selected-padding-left);
	color: var(--vtr-tab-selected-text-color);
	background-color: var(--vtr-tab-selected-background-color);
	background: var(--vtr-tab-selected-background);
	font-weight: var(--vtr-tab-selected-font-weight);
	text-shadow: var(--vtr-tab-selected-text-shadow);
	border-radius: var(--vtr-tab-selected-border-radius);
	border-top: var(--vtr-tab-selected-border-top-width) var(--vtr-tab-selected-border-top-style) var(--vtr-tab-selected-border-top-color);
	border-right: var(--vtr-tab-selected-border-right-width) var(--vtr-tab-selected-border-right-style) var(--vtr-tab-selected-border-right-color);
	border-bottom: var(--vtr-tab-selected-border-bottom-width) var(--vtr-tab-selected-border-bottom-style) var(--vtr-tab-selected-border-bottom-color);
	border-left: var(--vtr-tab-selected-border-left-width) var(--vtr-tab-selected-border-left-style) var(--vtr-tab-selected-border-left-color);
}

.tabbrowser-tab[selected="true"] .tab-buttons
{
	background-color: var(--vtr-tab-selected-background-color);
}

/* FIXME: Redo, remove? */
/* .tabbrowser-tab[selected="true"]:-moz-window-inactive {
	background-color: InactiveCaption !important;
	color: InactiveCaptionText !important; */
/* gnome/gtk/cleartype doesn't seem to have inactive states for selected items, lets try this */
/* } */

/*
 * 	Hover tabs
 */
.tabbrowser-tab:not([selected="true"]):hover {
	margin: var(--vtr-tab-hover-margin-top) var(--vtr-tab-hover-margin-right) var(--vtr-tab-hover-margin-bottom) var(--vtr-tab-hover-margin-left);
	padding: var(--vtr-tab-hover-padding-top) var(--vtr-tab-hover-padding-right) var(--vtr-tab-hover-padding-bottom) var(--vtr-tab-hover-padding-left);
	background-color: var(--vtr-tab-hover-background-color);
	background: var(--vtr-tab-hover-background);
}

.tabbrowser-tab:not([selected="true"]):hover .tab-buttons
{
	background-color: var(--vtr-tab-hover-background-color);
}

.tabbrowser-tab.hover-before
{
	border-top: var(--vtr-tab-hover-border-top);
}
.tabbrowser-tab.hover-after
{
	border-bottom: var(--vtr-tab-hover-border-bottom);
}

/*
 * 	Elementary stuff
 */
.tab-label {
	text-align: left;
}

.tab-label[pinned] {
	margin-left: 6px;
	position: relative;
}

.tab-content {
	-moz-margin-start: 0px;
	margin-top: 1px;
}

/* .tab-close-button {
	border-right: 10px solid var(--vtr-tab-selected-background-color);
} */

/* FIXME: tab-icon-image likely to be removed from this section */
.tab-icon,
.tab-icon-image {
	padding: 3px;
	background-color: transparent; /* VT Original: f2f2f2 for Dark Theme */
	border-radius: 2px;
	/*min-height: 22px !important;
	min-width: 22px !important;
	max-height: 22px;
	max-width: 22px;*/
	opacity: 1;
}

.tab-icon-image-dark {
	filter: invert(var(--vtr-tab-icon-invert-dark-icons));
}

.tabbrowser-tab:not(:hover):not([selected="true"]) .tab-close-button {
	display: none;
}

/* Keep the close button at a safe distance from the tab label. */
.tab-close-button {
    /* right: 4px;
	margin-left: 3px !important;
	margin-right: 1px !important;
	background-color: red;*/
	background-position: center center;
	width: var(--vtr-tab-button-close-width);
	height: var(--vtr-tab-button-close-height);
	background-size: var(--vtr-tab-button-close-width) var(--vtr-tab-button-close-height);
	filter: var(--vtr-tab-button-close-filter);
}


.tabbrowser-tab:not([pinned]) .tab-close-button {
	background-color: var(--vtr-tab-button-close-regular-background-color);
	background-image: var(--vtr-tab-button-close-regular-background-image);
	border-radius: var(--vtr-tab-button-close-regular-border-radius);
	border-color: var(--vtr-tab-button-close-regular-border-color);
	border-style: var(--vtr-tab-button-close-regular-border-style);
	border-width: var(--vtr-tab-button-close-regular-border-width);
}

.tabbrowser-tab:not([pinned]) .tab-close-button:hover {
	background-color: var(--vtr-tab-button-close-hover-background-color);
	background-image: var(--vtr-tab-button-close-hover-background-image);
	border-radius: var(--vtr-tab-button-close-hover-border-radius);
	border-color: var(--vtr-tab-button-close-hover-border-color);
	border-style: var(--vtr-tab-button-close-hover-border-style);
	border-width: var(--vtr-tab-button-close-hover-border-width);
}

.tabbrowser-tab:not([pinned]) .tab-close-button:active {
	background-color: var(--vtr-tab-button-close-active-background-color);
	background-image: var(--vtr-tab-button-close-active-background-image);
	border-radius: var(--vtr-tab-button-close-active-border-radius);
	border-color: var(--vtr-tab-button-close-active-border-color);
	border-style: var(--vtr-tab-button-close-active-border-style);
	border-width: var(--vtr-tab-button-close-active-border-width);
}

/*
.tab-icon-sound[soundplaying] {
	background-image: var(--vtr-tab-button-sound-playing-background-image);
    -moz-context-properties: fill;
    fill: var(--vtr-tab-button-sound-playing-fill);
}

.tab-icon-sound[muted] {
	background-image: var(--vtr-tab-button-sound-muted-background-image);
    -moz-context-properties: fill;
    fill: var(--vtr-tab-button-sound-muted-fill);
} */

.tab-sound-button
{
	background-size: var(--vtr-tab-button-sound-width) var(--vtr-tab-button-sound-height);
	background-position: center center;
	filter: var(--vtr-tab-button-sound-filter);
}

.tab-sound-button-playing {
    background-image: var(--vtr-tab-button-sound-playing-background-image);
}

.tab-sound-button-muted {
    background-image: var(--vtr-tab-button-sound-muted-background-image);
}


/*
 *	Tab Status
 */


/* unread */
body[data-style-tab-status="true"] .tabbrowser-tab[unread="true"]:not([data-discarded="true"]) .tab-label
{
	text-decoration: var(--vtr-tab-status-unread-text-decoration);
}

/* busy */
body[data-style-tab-status="true"] .tabbrowser-tab[status="loading"] .tab-label
{
	text-decoration: var(--vtr-tab-status-busy-text-decoration) !important;
}

/* unloaded */
body[data-style-tab-status="true"] .tabbrowser-tab[data-discarded="true"] .tab-label
{
	text-decoration: var(--vtr-tab-status-discarded-text-decoration) !important;
}
