/* Write your global styles here, in SCSS syntax. Variables and mixins from the src/variables.scss file are available here without importing */

/* imports */
// @use "assets/scrollbar.scss";
@import url("https://fonts.cdnfonts.com/css/manrope");

/* general style */
html,
body,
main {
	font-family: $font-family;
	width: 100%;
	height: 100%;
	margin: 0;
	color: $white;
	background-color: $space-black;
	margin-bottom: 0px;
	scroll-behavior: smooth;
}

h1.no-select,
h2.no-select,
h3.no-select,
h4.no-select,
h5.no-select,
h6.no-select{
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	cursor: default;
}

.link:link {
	color: $french-sky-blue;
	background-color: transparent;
	text-decoration: underline;
}

.link:visited {
	color: $deep-sky-blue;
	background-color: transparent;
	text-decoration: underline;
}

/* Scrollbars */

// Firefox
* {
    scrollbar-width: thin;
    scrollbar-color: $space-cadet #00000000;
    /* Set the thumb and track colors */
    background-clip: padding-box;
    /* Remove the background */
}

// Webkit & Blink
*::-webkit-scrollbar {
    width: 6px;
    background-color: #00000000;
    background-clip: padding-box;
    /* Remove the background */
}

*::-webkit-scrollbar-thumb {
    background-color: $space-cadet;
    border-radius: 5px;
}

*::-webkit-scrollbar-track {
    background-color: #00000000;
    /* Set a fallback color */
}

*::-webkit-scrollbar-track-piece {
    background-color: #00000000;
}