:root{
	--dark-primary-color: hsl(215deg 50% 16%); /*Background*/
	--default-primary-color: hsl(215deg 50% 36%); /*Background*/
	--light-primary-color: hsl(0deg 0% 85%); /*Background*/

	--text-primary-color: hsl(215deg 50% 16%); /*Color de texto*/
	--text-secondary-color: hsl(215deg 50% 36%); /*Color de texto*/
	--text-light-color: hsl(0deg,0%,100%); /*Color de texto*/
	--text-accent-color: hsl(357deg 81% 44%); /*Color de texto*/

	--accent-color: hsl(357deg 81% 44%); /*Background*/
	--lighting-accent-color: hsl(357deg 81% 64%); /*Background*/
	
	
	--divider-color: #BDBDBD; /*Color de borde*/
	--neutral-color: white; /*Blanco*/
	

    --shadow-color: hsl(0deg,0%,20%);
	--shadow-regular: 1px 1px 2px hsl(0deg,0%,20%);

	--shadow-level-0: drop-shadow(0px 0px 1px hsla(0deg,0%,20%,0));
	--shadow-level-1: drop-shadow(0px 1px 2px hsl(0deg,0%,20%));
	--shadow-level-2: drop-shadow(0px 4px 2px hsl(0deg,0%,20%));

	--shadow-up-level-0: drop-shadow(0px 0px 1px hsla(0deg,0%,20%,0));
	--shadow-up-level-1: drop-shadow(0px -1px 2px hsl(0deg,0%,20%));
	--shadow-up-level-2: drop-shadow(0px -4px 2px hsl(0deg,0%,20%));
}

/*Scrolls*/
/* Tamaño del scroll */
*::-webkit-scrollbar {
	width: 8px;
}

/* Estilos barra (thumb) de scroll */
*::-webkit-scrollbar-thumb {
	background: var(--accent-color);
	border-radius: 0px;
}

*::-webkit-scrollbar-thumb:active {
	background-color: #999999;
}

*::-webkit-scrollbar-thumb:hover {
	background: var(--dark-primary-color);
	box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.2);
}

/* Estilos track de scroll */
*::-webkit-scrollbar-track {
background: var(--lighting-accent-color);
border-radius: 0px;
}

*::-webkit-scrollbar-track:hover, 
*::-webkit-scrollbar-track:active {
background: var(--light-primary-color)
}