// $primary: #90be04;
// $red: #e33d23;
// $grey-hr: #efefef;
// $blue-dark: #0d26c5;
// $blue-light: #5ea9ff;
// $green-dark: #7bb20e;
// $green-light: #a5cf50;
// $rainbow-turqoise-light: #00b5ad;
// $rainbow-turqoise-dark: #1395c6;
// $rainbow-turqoise-blue: #4c7cbf;
// $cool-gray: #b3bfcb;
// $lime-light: #efff5d;
// $lime-medium: #c7da14;
// $lime-dark: #90be04;
// $glass-blue-light: #eafffe;
// $glass-blue-dark: #c9d9f1;
// $pink-light: #ff68a7;
// $pink-medium: #ca1e66;
// $pink-dark: #780638;
// $purple-light: #d41af9;
// $purple-medium: #bb1bdb;
// $purple-dark: #6b15b7;

// .blue-gradient {
// 	background: linear-gradient(to right, $blue-dark, $blue-light);
// }
// .green-gradient {
// 	background: linear-gradient(to right, $green-light, $green-dark);
// }
// .rainbow-gradient {
// 	background: linear-gradient(
// 		to right,
// 		$green-light 0%,
// 		$rainbow-turqoise-light 27%,
// 		$rainbow-turqoise-dark 68%,
// 		$rainbow-turqoise-blue 100%
// 	);
// }
// .lime-gradient {
// 	background: linear-gradient(to right, $lime-light 0%, $lime-medium 45%, $lime-dark 80%);
// }
// .glass-blue-gradient {
// 	background: linear-gradient(to right, $glass-blue-light 0%, $glass-blue-dark 100%);
// }
// .pink-gradient {
// 	background: linear-gradient(to right, $pink-light 0%, $pink-medium 46%, $pink-dark 80%);
// }
// .purple-gradient {
// 	background: linear-gradient(to right, $purple-light 0%, $purple-medium 22%, $purple-dark 100%);
// }

.blue-gradient {
	background: linear-gradient(to right, var(--cc-blue-dark), var(--cc-blue-light));
}
.green-gradient {
	background: linear-gradient(to right, var(--cc-green-light), var(--cc-green-dark));
}
.green-to-red-gradient {
	background: linear-gradient(to bottom, var(--cc-primary), var(--cc-red));
}
.rainbow-gradient {
	background: linear-gradient(
		to right,
		var(--cc-green-light) 0%,
		var(--cc-rainbow-turqoise-light) 27%,
		var(--cc-rainbow-turqoise-dark) 68%,
		var(--cc-rainbow-turqoise-blue) 100%
	);
}
.lime-gradient {
	background: linear-gradient(
		to right,
		var(--cc-lime-light),
		var(--cc-lime-medium),
		var(--cc-lime-dark)
	);
}
.glass-blue-gradient {
	background: linear-gradient(to right, var(--cc-glass-blue-light), var(--cc-glass-blue-dark));
}
.pink-gradient {
	background: linear-gradient(
		to right,
		var(--cc-pink-light),
		var(--cc-pink-medium),
		var(--cc-pink-dark)
	);
}
.purple-gradient {
	background: linear-gradient(
		to right,
		var(--cc-purple-light),
		var(--cc-purple-medium),
		var(--cc-purple-dark)
	);
}

$gradient-blue: linear-gradient(to right, var(--cc-blue-dark), var(--cc-blue-light));
$gradient-blue-angled: linear-gradient(135deg, var(--cc-blue-light), var(--cc-blue-dark));
$gradient-green: linear-gradient(to right, var(--cc-green-light), var(--cc-green-dark));
$green-to-red-gradient: linear-gradient(to bottom, var(--cc-primary), var(--cc-red));
$green-to-red-gradient-angled: linear-gradient(135deg, var(--cc-primary), var(--cc-red));
$gradient-rainbow: linear-gradient(
	135deg,
	var(--cc-green-light) 0%,
	var(--cc-rainbow-turqoise-light) 27%,
	var(--cc-rainbow-turqoise-dark) 68%,
	var(--cc-rainbow-turqoise-blue) 100%
);
$gradient-lime: linear-gradient(
	135deg,
	var(--cc-lime-light) 5%,
	var(--cc-lime-medium) 32%,
	var(--cc-lime-dark) 100%
);
$gradient-glass-blue: linear-gradient(
	to right,
	var(--cc-glass-blue-light),
	var(--cc-glass-blue-dark)
);
$gradient-pink: linear-gradient(
	to right,
	var(--cc-pink-light),
	var(--cc-pink-medium),
	var(--cc-pink-dark)
);
$gradient-purple: linear-gradient(
	to right,
	var(--cc-purple-light),
	var(--cc-purple-medium),
	var(--cc-purple-dark)
);
$gradient-cool-gray: linear-gradient(
	135deg,
	var(--cc-glass-blue-light) 5%,
	var(--cc-cool-gray) 45%
);