@import './variables.scss';

// Webkit scrollbars (Chrome, Opera, Safari, Edge... every browser but firefox
// https://developer.mozilla.org/en-US/docs/Web/CSS/::-webkit-scrollbar
::-webkit-scrollbar {
	-webkit-appearance: none;
	width: 7px;
	height: 7px;
}
::-webkit-scrollbar-thumb {
	border-radius: 4px;
	background-color: var($--theme-core-scrollbar-color);
}
::-webkit-scrollbar-corner {
	background: transparent;
}

// Just firefox
// https://developer.mozilla.org/en-US/docs/Web/CSS/scrollbar-color
body {
	scrollbar-color: var($--theme-core-scrollbar-color) transparent;
}

.scrollbar-toggle-button {
	position: fixed;
	top: 7px;
	left: 750px;
	width: 220px;
}

.disappearing-scrollbars {
	// Firefox
	scrollbar-color: transparent transparent;

	// Chrome
	&::-webkit-scrollbar-thumb {
		background-color: transparent;
	}

	&:hover {
		// Firefox
		scrollbar-color: var($--theme-core-scrollbar-color) transparent;

		// Chrome
		&::-webkit-scrollbar-thumb {
			background-color: var($--theme-core-scrollbar-color);
		}
	}
}