/* =========================================================
   SWAYAMTASK
   ADMIN LOGIN — V1.0
   ========================================================= */


/* ---------------------------------------------------------
   GLOBAL LOGIN TYPOGRAPHY
   EVERYTHING = MANROPE
   --------------------------------------------------------- */

.swayamtask-login-wrap,
.swayamtask-login-wrap *,
.swayamtask-login-wrap input,
.swayamtask-login-wrap button,
.swayamtask-login-wrap a {
	font-family: "Manrope", sans-serif;
}


/* ---------------------------------------------------------
   LOGIN WRAPPER
   --------------------------------------------------------- */

.swayamtask-login-wrap {
	min-height: 70vh;

	display: flex;
	align-items: center;
	justify-content: center;

	padding: 48px 20px;

	box-sizing: border-box;
}


/* ---------------------------------------------------------
   LOGIN CARD
   --------------------------------------------------------- */

.swayamtask-login-card {
	width: 100%;
	max-width: 440px;

	background: #FFFFFF;

	border: 1px solid #E5E7EB;
	border-radius: 16px;

	padding: 40px;

	box-sizing: border-box;

	box-shadow:
		0 16px 50px rgba(15, 23, 42, 0.08);
}


/* ---------------------------------------------------------
   SWAYAMTASK BRAND
   SWAYAM = BLUE
   TASK   = ORANGE
   --------------------------------------------------------- */

.swayamtask-login-brand {
	margin-bottom: 26px;

	font-family: "Manrope", sans-serif;
	font-size: 24px;
	line-height: 1;

	font-weight: 900;

	letter-spacing: -0.6px;

	color: #005F9C;
}

.swayamtask-login-brand span {
	font-family: "Manrope", sans-serif;

	font-weight: 900;

	color: #F28C28;
}


/* ---------------------------------------------------------
   ADMINISTRATION KICKER
   --------------------------------------------------------- */

.swayamtask-login-kicker {
	margin-bottom: 8px;

	font-family: "Manrope", sans-serif;

	font-size: 11px;
	line-height: 1.2;

	font-weight: 700;

	letter-spacing: 1.5px;

	color: #005F9C;
}


/* ---------------------------------------------------------
   MAIN HEADING
   H1 = 900
   --------------------------------------------------------- */

.swayamtask-login-card h1 {
	margin: 0 0 8px;

	font-family: "Manrope", sans-serif;

	font-size: 30px;
	line-height: 1.2;

	font-weight: 900;

	letter-spacing: -0.6px;

	color: #1F2937;
}


/* ---------------------------------------------------------
   SUBTITLE / DESCRIPTION
   --------------------------------------------------------- */

.swayamtask-login-subtitle,
.swayamtask-login-card p {
	font-family: "Manrope", sans-serif;

	font-size: 14px;
	line-height: 1.6;

	font-weight: 400;

	color: #646A6E;
}


/* ---------------------------------------------------------
   FORM
   --------------------------------------------------------- */

.swayamtask-login-form {
	margin-top: 26px;
}


/* ---------------------------------------------------------
   FORM LABELS
   --------------------------------------------------------- */

.swayamtask-login-form label {
	display: block;

	margin: 0 0 7px;

	font-family: "Manrope", sans-serif;

	font-size: 13px;
	line-height: 1.4;

	font-weight: 600;

	color: #1F2937;
}


/* ---------------------------------------------------------
   TEXT / EMAIL / PASSWORD INPUTS
   --------------------------------------------------------- */

.swayamtask-login-form input[type="text"],
.swayamtask-login-form input[type="email"],
.swayamtask-login-form input[type="password"] {
	width: 100%;
	height: 48px;

	margin: 0 0 18px;

	padding: 0 13px;

	box-sizing: border-box;

	border: 1px solid #D7DCE2;
	border-radius: 8px;

	background: #FFFFFF;

	font-family: "Manrope", sans-serif;

	font-size: 14px;
	line-height: 48px;

	font-weight: 400;

	color: #1F2937;

	outline: none;

	transition:
		border-color 0.2s ease,
		box-shadow 0.2s ease;
}


/* ---------------------------------------------------------
   INPUT FOCUS
   --------------------------------------------------------- */

.swayamtask-login-form input[type="text"]:focus,
.swayamtask-login-form input[type="email"]:focus,
.swayamtask-login-form input[type="password"]:focus {
	border-color: #005F9C;

	box-shadow:
		0 0 0 3px rgba(0, 95, 156, 0.10);

	outline: none;
}


/* ---------------------------------------------------------
   INPUT PLACEHOLDER
   --------------------------------------------------------- */

.swayamtask-login-form input::placeholder {
	font-family: "Manrope", sans-serif;

	font-size: 14px;

	font-weight: 400;

	color: #9AA2AA;

	opacity: 1;
}


/* ---------------------------------------------------------
   REMEMBER ME
   --------------------------------------------------------- */

.swayamtask-login-check {
	display: flex !important;

	align-items: center;

	gap: 8px;

	margin: 0 0 20px !important;

	font-family: "Manrope", sans-serif !important;

	font-size: 13px !important;

	line-height: 1.4;

	font-weight: 500 !important;

	color: #646A6E !important;
}

.swayamtask-login-check input {
	width: auto !important;
	height: auto !important;

	margin: 0 !important;

	padding: 0 !important;

	accent-color: #005F9C;
}


/* ---------------------------------------------------------
   PRIMARY BUTTON
   --------------------------------------------------------- */

.swayamtask-login-button {
	display: inline-flex;

	align-items: center;
	justify-content: center;

	width: 100%;
	min-height: 48px;

	padding: 0 20px;

	box-sizing: border-box;

	border: 0;
	border-radius: 8px;

	background: #005F9C;

	color: #FFFFFF !important;

	text-decoration: none;

	font-family: "Manrope", sans-serif;

	font-size: 15px;
	line-height: 1;

	font-weight: 700;

	cursor: pointer;

	transition:
		background-color 0.2s ease,
		transform 0.2s ease,
		box-shadow 0.2s ease;
}


/* ---------------------------------------------------------
   BUTTON HOVER
   --------------------------------------------------------- */

.swayamtask-login-button:hover {
	background: #004B7A;

	color: #FFFFFF !important;

	box-shadow:
		0 6px 16px rgba(0, 95, 156, 0.18);
}


/* ---------------------------------------------------------
   BUTTON FOCUS
   --------------------------------------------------------- */

.swayamtask-login-button:focus {
	outline: none;

	box-shadow:
		0 0 0 3px rgba(0, 95, 156, 0.18);
}


/* ---------------------------------------------------------
   FORGOT PASSWORD
   --------------------------------------------------------- */

.swayamtask-login-forgot {
	margin-top: 16px;

	text-align: center;
}

.swayamtask-login-forgot a {
	font-family: "Manrope", sans-serif;

	font-size: 13px;

	line-height: 1.4;

	font-weight: 600;

	color: #005F9C;

	text-decoration: none;
}

.swayamtask-login-forgot a:hover {
	color: #F28C28;

	text-decoration: underline;
}


/* ---------------------------------------------------------
   ERROR MESSAGE
   --------------------------------------------------------- */

.swayamtask-login-error {
	margin-top: 18px;

	padding: 12px 14px;

	box-sizing: border-box;

	background: #FFF4F4;

	border: 1px solid #F2C7C7;

	border-radius: 8px;

	font-family: "Manrope", sans-serif;

	font-size: 13px;

	line-height: 1.5;

	font-weight: 400;

	color: #9B1C1C;
}


/* ---------------------------------------------------------
   SUCCESS MESSAGE
   --------------------------------------------------------- */

.swayamtask-login-success {
	margin-top: 18px;

	padding: 12px 14px;

	box-sizing: border-box;

	background: #F0FDF4;

	border: 1px solid #BBF7D0;

	border-radius: 8px;

	font-family: "Manrope", sans-serif;

	font-size: 13px;

	line-height: 1.5;

	font-weight: 400;

	color: #166534;
}


/* ---------------------------------------------------------
   INFORMATION NOTE
   --------------------------------------------------------- */

.swayamtask-login-note {
	margin-top: 22px;

	padding-top: 18px;

	border-top: 1px solid #EDF0F2;

	font-family: "Manrope", sans-serif;

	font-size: 12px;

	line-height: 1.5;

	font-weight: 400;

	color: #7A838C;
}


/* ---------------------------------------------------------
   LINKS
   --------------------------------------------------------- */

.swayamtask-login-card a {
	font-family: "Manrope", sans-serif;
}


/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 480px) {

	.swayamtask-login-wrap {
		padding: 32px 16px;
	}

	.swayamtask-login-card {
		max-width: 100%;

		padding: 30px 24px;

		border-radius: 14px;
	}

	.swayamtask-login-brand {
		font-size: 22px;
	}

	.swayamtask-login-card h1 {
		font-size: 28px;
	}

}