:where([class^="ri-"])::before {
	content: "\f3c2";
}

body {
	font-family: 'Inter', sans-serif;
	background-color: #f9f9fc;
}

.switch-input {
	height: 0;
	width: 0;
	visibility: hidden;
	position: absolute;
}

.switch-label {
	display: flex;
	align-items: center;
	justify-content: space-between;
	cursor: pointer;
	width: 50px;
	height: 26px;
	background: #e0e0e0;
	border-radius: 100px;
	position: relative;
	transition: background-color 0.2s;
}

.switch-label:after {
	content: "";
	position: absolute;
	top: 3px;
	left: 3px;
	width: 20px;
	height: 20px;
	background: #fff;
	border-radius: 90px;
	transition: 0.2s;
}

.switch-input:checked+.switch-label {
	background: #5539CC;
}

.switch-input:checked+.switch-label:after {
	left: calc(100% - 3px);
	transform: translateX(-100%);
}

.custom-scrollbar::-webkit-scrollbar {
	width: 6px;
}

.custom-scrollbar::-webkit-scrollbar-track {
	background: #f1f1f1;
	border-radius: 10px;
}

.custom-scrollbar::-webkit-scrollbar-thumb {
	background: #d1d1d1;
	border-radius: 10px;
}

.custom-scrollbar::-webkit-scrollbar-thumb:hover {
	background: #b1b1b1;
}

.tab-active {
	color: #5539CC;
	border-bottom: 2px solid #5539CC;
}

.milestone-line {
	position: absolute;
	left: 18px;
	top: 24px;
	bottom: 0;
	width: 2px;
	background-color: #e5e7eb;
	z-index: 0;
}

.milestone-dot {
	position: relative;
	z-index: 1;
}