sidebery.css

/* ROOT */

#root {
	/* Tab and PinnedTab height adjustment */
	--tabs-height: 33px;
	--tabs-pinned-height: var(--tabs-height);
	/* Dark Theme base settings */
	--bg: #1c1b22 !important;
	--tabs-fg: #d4d4d4 !important;
	--tabs-bg-hover: #3b3948 !important;
	--tabs-activated-bg: #5b5b66 !important;
	--nav-btn-activated-bg: #1f222f !important;
}

#root .Tab {
	--tabs-indent: 7px;
}

/* TABS */

.Tab .lvl-wrapper:after {
	display: none;
}

.Tab {
	margin: auto;
	width: 94%;
	border-radius: 3px;
}

.Tab .close > svg:hover {
	/* Styling the tab close button */
	border-radius: 3px;
	background: #492121 !important;
	opacity: 100%;
}

.Tab .title {
	overflow: hidden !important;
}

/* PINNED TABS */

.PinnedDock {
	background-color: var(--bg) !important;
}

.PinnedTab {
	margin: 5px 0px 4px 6px;
	border-radius: 3px;
}

/* NAV BAR */

.NavigationBar {
	height: 41px !important;
	padding: 4.5px 0px 0px 4.5px !important;
	background-color: #2b2a33 !important;
	margin-bottom: 5px;
}

.NavigationBar .panel-btn:hover {
	border-radius: 3px !important;
	background-color: var(--tabs-bg-hover) !important;
}

.NavigationBar .panel-btn[data-active="true"] {
	border-radius: 3px !important;
	background-color: var(--bg) !important;
}

.NavigationBar .panel-btn[data-active="true"]:hover {
	border-radius: 3px !important;
	background-color: var(--tabs-bg-hover) !important;
}

.NavigationBar .panel-btn > svg,
.NavigationBar .panel-btn > img {
	fill: #f2f2f2 !important;
}

/* SIDEBAR HACK PATCHES */

@media (max-width: 50px) {
	/* Fix to tab tree identation when minimised */
	#root:not(:hover) .Tab {
		--tabs-indent: 0px;
	}

	.Tab[data-lvl] > div.lvl-wrapper {
		right: -2px;
	}

	.Tab {
		max-width: 34px;
	}

	.Tab .fav {
		z-index: 1;
	}

	.Tab .audio {
		z-index: 1;
		margin-left: -12px;
		height: 26px;
	}

	.Tab .title {
		display: none;
	}

	.PinnedTab {
		margin-left: 5px;
	}

	.NavigationBar .settings-btn {
		display: none;
	}
}

/* OPTIONAL */

/* Disable these two snippets below to make pinned tabs wrap when minimised */
.PinnedDock {
	flex-wrap: nowrap !important;
}

.PinnedTab {
	overflow: hidden !important;
	min-width: var(--tabs-pinned-width) !important;
}

/* Optional patch for better tab notifications on pinned tabs */
/*
.PinnedTab[data-audible] .fav > img,
.PinnedTab[data-muted] .fav > img,
.PinnedTab[data-loading] .fav > img {
  mask: none;
}

.PinnedTab .fav > img {
  mask: none;
}

.PinnedTab[data-updated="true"] .fav > img {
  mask: radial-gradient(circle at calc(100% - 2px) calc(100% - 2px),rgba(0,0,0,0.141),rgba(0,0,0,0.141) 4px,#000 5px,#000);
}

.PinnedTab .audio-badge {
  top: 5px;
}

.PinnedTab .update-badge {
  opacity: 0;
}

.PinnedTab[data-updated="true"] .update-badge {
  opacity: 100;
}
*/