/* On login page: remove the blue autofill background */
input:-webkit-autofill,
input:-webkit-autofill:focus,
input:-webkit-autofill:hover,
input:-webkit-autofill:active {
	-webkit-box-shadow: 0 0 0 1000px white inset !important;
	box-shadow: 0 0 0 1000px white inset !important;
	background-color: white !important;
	color: #222 !important;
}

/* Scrollbars */
/* For Chrome, Edge, Safari */
::-webkit-scrollbar {
	width: 8px;
	/* thinner */
}

::-webkit-scrollbar-thumb {
	background: #22c55e;
	/* green */
	border-radius: 4px;
}

::-webkit-scrollbar-track {
	background: #f0f0f0;
}

::-webkit-scrollbar-button {
	display: none;
	/* hides arrows */
}

/* For Firefox */
* {
	scrollbar-width: thin;
	scrollbar-color: #22c55e #f0f0f0;
}

.dn {
	display: none;
}

.cp {
	cursor: pointer;
}

.cna {
	cursor: not-allowed;
}

.pen {
	pointer-events: none;
}

.pea {
	pointer-events: auto;
}

.dr-flex {
	display: flex;
	flex-direction: row;
	align-items: center;
}

.dc-flex {
	display: flex;
	flex-direction: column;
}

.fal-center {
	align-items: center;
}

.fal-top {
	align-items: flex-start;
}

.fal-bottom {
	align-items: flex-end;
}

.fjc-center {
	justify-content: center;
}

.fjc-left {
	justify-content: flex-start;
}

.fjc-right {
	justify-content: flex-end;
}

.fcg-5 {
	column-gap: 5px;
}

.fcg-10 {
	column-gap: 10px;
}

.fcg-15 {
	column-gap: 15px;
}

.fcg-20 {
	column-gap: 20px;
}

.fcg-30 {
	column-gap: 30px;
}

.fcg-40 {
	column-gap: 40px;
}

.fcg-50 {
	column-gap: 50px;
}

.fjc-space {
	justify-content: space-between;
}

.ta-c {
	text-align: center;
}

.ta-l {
	text-align: left;
}

.ta-r {
	text-align: right;
}

.w-100 {
	width: 100%;
}

.h-100 {
	height: 100%;
}

.bs-bb {
	box-sizing: border-box;
}

/* Responsive font sizes using clamp() */
.fs-9 {
	font-size: clamp(8px, 2vw, 9px);
}

.fs-10 {
	font-size: clamp(9px, 2.2vw, 10px);
}

.fs-11 {
	font-size: clamp(10px, 2.4vw, 11px);
}

.fs-12 {
	font-size: clamp(10px, 2.6vw, 12px);
}

.fs-13 {
	font-size: clamp(11px, 2.8vw, 13px);
}

.fs-14 {
	font-size: clamp(12px, 3vw, 14px);
}

.fs-15 {
	font-size: clamp(13px, 3.2vw, 15px);
}

.fs-16 {
	font-size: clamp(14px, 3.4vw, 16px);
}

.fs-17 {
	font-size: clamp(14px, 3.6vw, 17px);
}

.fs-18 {
	font-size: clamp(15px, 3.8vw, 18px);
}

.fs-20 {
	font-size: clamp(16px, 4.2vw, 20px);
}

.fs-22 {
	font-size: clamp(18px, 4.6vw, 22px);
}

.fs-24 {
	font-size: clamp(19px, 5vw, 24px);
}

.fs-25 {
	font-size: clamp(20px, 5.2vw, 25px);
}

.fs-30 {
	font-size: clamp(22px, 6.2vw, 30px);
}

.fs-35 {
	font-size: clamp(25px, 7.2vw, 35px);
}

.fs-40 {
	font-size: clamp(28px, 8.2vw, 40px);
}

.fi {
	font-style: italic;
}

/* Light */
.fw-300 {
	font-weight: 300;
}

/* Normal */
.fw-400 {
	font-weight: 400;
}

/* Medium */
.fw-500 {
	font-weight: 500;
}

/* Semi-bold */
.fw-600 {
	font-weight: 600;
}

/* Bold */
.fw-700 {
	font-weight: 700;
}

.fw-900 {
	font-weight: 900;
}

.mt-0 {
	margin-top: 0px;
}

.mt-5 {
	margin-top: 5px;
}

.mt-10 {
	margin-top: 10px;
}

.mt-15 {
	margin-top: 15px;
}

.mt-20 {
	margin-top: 20px;
}

.mt-25 {
	margin-top: 25px;
}

.mt-30 {
	margin-top: 30px;
}

.mt-35 {
	margin-top: 35px;
}

.mt-40 {
	margin-top: 40px;
}

.mt-45 {
	margin-top: 45px;
}

.mt-50 {
	margin-top: 50px;
}

.mt-responsive-sm {
	margin-top: clamp(10px, 3vw, 20px);
}

.mt-responsive-md {
	margin-top: clamp(15px, 4vw, 30px);
}

.mt-responsive-lg {
	margin-top: clamp(20px, 5vw, 40px);
}

.mb-0 {
	margin-bottom: 0px;
}

.mb-5 {
	margin-bottom: 5px;
}

.mb-10 {
	margin-bottom: 10px;
}

.mb-15 {
	margin-bottom: 15px;
}

.mb-20 {
	margin-bottom: 20px;
}

.mb-25 {
	margin-bottom: 25px;
}

.mb-30 {
	margin-bottom: 30px;
}

.mb-35 {
	margin-bottom: 35px;
}

.mb-responsive-sm {
	margin-top: clamp(10px, 3vw, 20px);
}

.mb-responsive-md {
	margin-top: clamp(15px, 4vw, 30px);
}

.mb-responsive-lg {
	margin-top: clamp(20px, 5vw, 40px);
}

.p-5 {
	padding: 5px;
}

.p-10 {
	padding: 10px;
}

.p-15 {
	padding: 15px;
}

.ptb-5 {
	padding-top: 5px;
	padding-bottom: 5px;
}

.ptb-10 {
	padding-top: 10px;
	padding-bottom: 10px;
}

.ptb-15 {
	padding-top: 15px;
	padding-bottom: 15px;
}

.ptb-20 {
	padding-top: 20px;
	padding-bottom: 20px;
}

.ptb-25 {
	padding-top: 25px;
	padding-bottom: 25px;
}

.plr-5 {
	padding-left: 5px;
	padding-right: 5px;
}

.plr-10 {
	padding-left: 10px;
	padding-right: 10px;
}

.plr-15 {
	padding-left: 15px;
	padding-right: 15px;
}

.plr-20 {
	padding-left: 20px;
	padding-right: 20px;
}

.plr-25 {
	padding-left: 25px;
	padding-right: 25px;
}

.plr-30 {
	padding-left: 30px;
	padding-right: 30px;
}

.fjb {
	border: 1px solid #ff0000;
}