/*
 * Param authentication experience.
 * Target: WordPress 6.0+; gracefully degrades on older browsers.
 */

:root {
	/* Shared Param dashboard palette from dashboard.css. */
	--param-login-primary: #648e50;
	--param-login-secondary: #9bc47d;
	--param-login-primary-dark: #587b45;
	--param-login-soft: #f2f6ec;
	--param-login-accent: #f48652;
	--param-login-ink: #282822;
	--param-login-muted: #7b7a72;
	--param-login-border: #ebe9e2;
	--param-login-surface: #fffdfa;
}

html,
body.login {
	min-height: 100%;
}

body.login {
	display: flex;
	align-items: center;
	box-sizing: border-box;
	margin: 0;
	padding: 3rem 6vw;
	direction: rtl;
	background: #f8f5ef;
	color: var(--param-login-ink);
	font-family: "Kahroba", Tahoma, Arial, sans-serif !important;
	font-weight: 350;
}

body.login * {
	box-sizing: border-box;
}

body.login :where(h1, h2, h3, h4, h5, h6),
body.login :where(p, a, label, span, strong) {
	font-family: "Kahroba", Tahoma, Arial, sans-serif !important;
}

body.login :where(h1, h2, h3, h4, h5, h6) {
	font-style: normal;
	letter-spacing: 0;
}

body.login #login {
	position: relative;
	z-index: 2;
	width: min(27rem, 42vw);
	margin: auto 7vw auto auto;
	padding: 2.35rem 2.5rem 2.15rem;
	border: 1px solid rgba(100, 142, 80, .13);
	border-radius: 2rem;
	background: rgba(255, 253, 250, .95);
	box-shadow: 0 1.5rem 5rem rgba(72, 67, 50, .1);
	backdrop-filter: blur(1rem);
}

.login h1 {
	margin: 0 0 1.65rem;
	text-align: right;
}

.login h1 a {
	width: 9rem;
	height: 3.25rem;
	margin: 0;
	background-position: right center;
	background-size: contain;
}

.param-login-intro {
	margin-bottom: 1.5rem;
}

.param-login-intro h2 {
	margin: 0 0 .55rem;
	color: var(--param-login-ink);
	font-size: calc(clamp(1.65rem, 2.4vw, 2rem) + .1rem);
	font-weight: 700;
	line-height: 1.35;
}

.param-login-intro p {
	margin: 0;
	color: var(--param-login-muted);
	font-size: 1.02rem;
	line-height: 1.9;
}

.login form,
.login .admin-email-confirm-form {
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
	overflow: visible;
}

.login form .input,
.login input[type="text"],
.login input[type="email"],
.login input[type="password"] {
	width: 100%;
	min-height: 3.35rem;
	margin: .45rem 0 1.05rem;
	padding: .7rem 1rem;
	border: 1px solid var(--param-login-border);
	border-radius: .9rem;
	background: #fbfaf7;
	color: var(--param-login-ink);
	font-size: 1.1rem;
	font-weight: 420;
	box-shadow: none;
	transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.login form .input:focus,
.login input[type="text"]:focus,
.login input[type="email"]:focus,
.login input[type="password"]:focus {
	border-color: var(--param-login-primary);
	background: #fff;
	box-shadow: 0 0 0 .22rem color-mix(in srgb, var(--param-login-primary) 13%, transparent);
	outline: 0;
}

.login label {
	color: #4d4b44;
	font-size: .98rem;
	font-weight: 520;
	line-height: 1.7;
}

.login form > p > label {
	display: block;
	width: 100%;
}

.param-register-type {
	min-width: 0;
	margin: .2rem 0 1.15rem;
	padding: 0;
	border: 0;
}

.param-register-type legend {
	margin: 0 0 .25rem;
	color: #4d4b44;
	font-size: .98rem;
	font-weight: 650;
}

.param-register-type > p {
	margin: 0 0 .65rem;
	color: var(--param-login-muted);
	font-size: .82rem;
	line-height: 1.75;
}

.param-register-type__tabs {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: .55rem;
}

.param-register-type__tabs label {
	position: relative;
	margin: 0;
	cursor: pointer;
}

.param-register-type__tabs input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.param-register-type__tabs label > span {
	display: grid;
	min-height: 6.2rem;
	align-content: center;
	justify-items: center;
	gap: .18rem;
	padding: .7rem .45rem;
	border: 1px solid var(--param-login-border);
	border-radius: .9rem;
	color: #77756e;
	background: #fbfaf7;
	text-align: center;
	transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}

.param-register-type__tabs input:checked + span {
	border-color: var(--param-login-primary);
	color: var(--param-login-primary-dark);
	background: var(--param-login-soft);
	box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--param-login-primary) 10%, transparent);
}

.param-register-type__tabs input:focus-visible + span {
	outline: .16rem solid color-mix(in srgb, var(--param-login-primary) 35%, transparent);
	outline-offset: .15rem;
}

.param-register-type__icon {
	width: 1.5rem;
	height: 1.5rem;
	margin-bottom: .15rem;
	color: currentColor;
}

.param-register-type__tabs b,
.param-register-type__tabs small {
	display: block;
}

.param-register-type__tabs b {
	font-size: .9rem;
}

.param-register-type__tabs small {
	color: var(--param-login-muted);
	font-size: .7rem;
	font-weight: 400;
}

.param-register-type__notice {
	display: block;
	margin-top: .6rem;
	padding: .5rem .65rem;
	border-radius: .65rem;
	color: #76531f;
	background: color-mix(in srgb, var(--param-login-accent) 10%, #fff);
	font-size: .72rem;
	line-height: 1.7;
}

.param-register-type__notice[hidden] {
	display: none;
}

.param-register-form .param-register-step {
	display: flex;
	align-items: center;
	gap: .55rem;
	margin: 0 0 1rem;
	color: var(--param-login-ink);
	font-weight: 650;
}

.param-register-step span {
	display: inline-grid;
	width: 2rem;
	height: 2rem;
	place-items: center;
	border-radius: 50%;
	background: var(--param-login-accent);
	color: #fff;
	font-size: .9rem;
}

.param-register-form .param-register-hint,
.param-register-form .param-field-help {
	display: block;
	margin: -.25rem 0 .8rem;
	color: var(--param-login-muted);
	font-size: .82rem;
	line-height: 1.8;
}

.param-register-form .param-code-input {
	direction: ltr;
	text-align: center;
	font-size: 1.3rem;
	font-weight: 650;
	letter-spacing: .18em;
}

.param-password-group {
	margin: .35rem 0 .2rem;
	padding: 1rem;
	border: 1px solid color-mix(in srgb, var(--param-login-primary) 15%, var(--param-login-border));
	border-radius: 1.15rem;
	background: linear-gradient(145deg, rgba(255, 255, 255, .78), rgba(242, 246, 236, .72));
	box-shadow: 0 .75rem 2rem rgba(72, 67, 50, .055);
}

.param-register-form .param-password-control {
	margin: 0;
}

.param-password-input {
	position: relative;
	display: block;
}

.login .param-password-input .input {
	margin-bottom: .65rem;
	padding-left: 3.2rem;
	background: rgba(255, 255, 255, .78);
}

.param-password-toggle {
	position: absolute;
	top: calc(50% - .1rem);
	left: .55rem;
	display: grid;
	width: 2.25rem;
	height: 2.25rem;
	padding: 0;
	place-items: center;
	transform: translateY(-50%);
	border: 0;
	border-radius: .65rem;
	background: transparent;
	color: var(--param-login-muted);
	cursor: pointer;
	transition: color .18s ease, background .18s ease;
}

.param-password-toggle:hover,
.param-password-toggle:focus-visible,
.param-password-toggle.is-visible {
	background: var(--param-login-soft);
	color: var(--param-login-primary-dark);
	outline: 0;
}

.param-password-toggle:focus-visible {
	box-shadow: 0 0 0 .16rem color-mix(in srgb, var(--param-login-primary) 24%, transparent);
}

.param-password-toggle svg {
	width: 1.25rem;
	height: 1.25rem;
	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.7;
}

.param-password-toggle.is-visible svg {
	opacity: .68;
}

.param-password-strength {
	margin: .1rem 0 1rem;
	padding: .75rem;
	border-radius: .85rem;
	background: rgba(255, 255, 255, .68);
}

.param-password-strength__heading {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: .75rem;
	color: var(--param-login-muted);
	font-size: .78rem;
}

.param-password-strength__heading strong {
	color: #85827a;
	font-size: .8rem;
	font-weight: 680;
	transition: color .2s ease;
}

.param-password-strength__meter {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: .3rem;
	margin: .55rem 0;
	direction: rtl;
}

.param-password-strength__meter i {
	height: .34rem;
	border-radius: 1rem;
	background: #e7e5df;
	transition: background .25s ease, transform .25s ease;
}

.param-password-strength[data-score="0"] { --param-strength-color: #c64d5d; }
.param-password-strength[data-score="1"] { --param-strength-color: #d9704b; }
.param-password-strength[data-score="2"] { --param-strength-color: #d59a35; }
.param-password-strength[data-score="3"] { --param-strength-color: #78a65c; }
.param-password-strength[data-score="4"] { --param-strength-color: #3f8a67; }

.param-password-strength:not([data-score="empty"]) .param-password-strength__heading strong {
	color: var(--param-strength-color);
}

.param-password-strength[data-score="0"] .param-password-strength__meter i:nth-child(-n+1),
.param-password-strength[data-score="1"] .param-password-strength__meter i:nth-child(-n+1),
.param-password-strength[data-score="2"] .param-password-strength__meter i:nth-child(-n+2),
.param-password-strength[data-score="3"] .param-password-strength__meter i:nth-child(-n+3),
.param-password-strength[data-score="4"] .param-password-strength__meter i:nth-child(-n+4) {
	background: var(--param-strength-color);
	transform: scaleY(1.14);
}

.param-password-strength > p {
	min-height: 2.8em;
	margin: 0;
	color: #69675f;
	font-size: .74rem;
	line-height: 1.75;
}

.param-password-criteria {
	display: flex;
	flex-wrap: wrap;
	gap: .38rem;
	margin: .55rem 0 0;
	padding: 0;
	list-style: none;
}

.param-password-criteria li {
	display: inline-flex;
	align-items: center;
	gap: .3rem;
	padding: .24rem .48rem;
	border-radius: 2rem;
	background: #f1efea;
	color: #817f77;
	font-size: .67rem;
	line-height: 1.55;
	transition: color .2s ease, background .2s ease;
}

.param-password-criteria li::before {
	display: inline-grid;
	width: .9rem;
	height: .9rem;
	place-items: center;
	border: 1px solid #cbc8bf;
	border-radius: 50%;
	content: "";
	font-size: .62rem;
}

.param-password-criteria li.is-met {
	background: #edf6e9;
	color: #537b40;
}

.param-password-criteria li.is-met::before {
	border-color: var(--param-login-primary);
	background: var(--param-login-primary);
	color: #fff;
	content: "✓";
}

.param-password-match {
	display: block;
	min-height: 1.7rem;
	margin: -.25rem 0 .45rem;
	color: var(--param-login-muted);
	font-size: .74rem;
	line-height: 1.7;
}

.param-password-match.is-match { color: #3f8060; }
.param-password-match.is-mismatch { color: #b84f5d; }

.param-register-form .submit {
	margin-top: .35rem;
}

.param-register-form .submit .button,
.param-register-form .submit button {
	width: 100%;
	min-height: 3.25rem;
}

.param-register-back {
	margin: .9rem 0 0;
	text-align: center;
}

.param-register-back a {
	color: var(--param-login-primary-dark);
	font-weight: 580;
	text-decoration: none;
}

.login .param-registration-success {
	border-right-color: var(--param-login-primary);
	background: var(--param-login-soft);
}

body.param-register-custom #login {
	width: min(29rem, 44vw);
}

.login .user-pass-wrap,
.login .user-pass1-wrap {
	position: relative;
}

.login .wp-pwd {
	position: relative;
}

.login .wp-pwd .input {
	padding-left: 3.15rem;
}

.login .button.wp-hide-pw {
	top: .58rem;
	right: auto;
	left: .45rem;
	width: 2.35rem;
	height: 2.35rem;
	min-width: 0;
	padding: 0;
	border: 0;
	color: var(--param-login-muted);
	box-shadow: none;
}

.login .forgetmenot {
	display: flex;
	align-items: center;
	float: none;
	margin: .1rem 0 1.2rem;
}

.login .forgetmenot label {
	display: inline-flex;
	align-items: center;
	white-space: nowrap;
}

.login input[type="checkbox"] {
	width: 1.15rem;
	height: 1.15rem;
	margin: 0 0 0 .45rem;
	border: 1px solid #d2d6cc;
	border-radius: .35rem;
	box-shadow: none;
}

.login input[type="checkbox"]:checked {
	border-color: var(--param-login-primary);
	background: var(--param-login-primary);
}

.login input[type="checkbox"]:checked::before {
	width: 1.25rem;
	height: 1.25rem;
	margin: -.08rem -.1rem 0 0;
	color: #fff;
}

.login .submit {
	margin-top: .35rem;
}

.login .button-primary,
.login .admin-email-confirm-form .button-primary {
	float: none;
	width: 100%;
	min-height: 3.35rem;
	padding: .65rem 1.25rem;
	border: 1px solid var(--param-login-primary);
	border-radius: .9rem;
	background: var(--param-login-primary);
	color: #fff;
	font-size: 1.06rem;
	font-weight: 680;
	line-height: 1.5;
	text-shadow: none;
	box-shadow: 0 .75rem 1.7rem color-mix(in srgb, var(--param-login-primary) 24%, transparent);
	transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
}

.login .button-primary:hover,
.login .button-primary:focus,
.login .admin-email-confirm-form .button-primary:hover,
.login .admin-email-confirm-form .button-primary:focus {
	border-color: var(--param-login-primary);
	color: #fff;
	background: var(--param-login-primary-dark);
	filter: none;
	transform: translateY(-1px);
	box-shadow: 0 .9rem 2rem color-mix(in srgb, var(--param-login-primary) 31%, transparent);
}

.login .button-primary:focus,
.login a:focus {
	outline: .16rem solid color-mix(in srgb, var(--param-login-primary) 35%, transparent);
	outline-offset: .18rem;
	box-shadow: none;
}

.login #nav {
	margin: 1.35rem 0 0;
	padding: 1.2rem 0 0;
	border-top: 1px solid var(--param-login-border);
	text-align: center;
}

.login #backtoblog {
	margin: .75rem 0 0;
	padding: 0;
	text-align: center;
}

.login #nav a,
.login #backtoblog a,
.login .privacy-policy-page-link a {
	color: var(--param-login-primary);
	font-size: .96rem;
	font-weight: 620;
	text-decoration: none;
}

.login #nav a:hover,
.login #backtoblog a:hover,
.login .privacy-policy-page-link a:hover {
	color: var(--param-login-ink);
	text-decoration: none;
}

.login .message,
.login .notice,
.login #login_error {
	margin: 0 0 1.3rem;
	padding: .85rem 1rem;
	border: 0;
	border-right: .25rem solid var(--param-login-primary);
	border-radius: .75rem;
	background: color-mix(in srgb, var(--param-login-secondary) 22%, #fff);
	color: #48473f;
	font-size: .95rem;
	line-height: 1.8;
	box-shadow: none;
}

.login #login_error,
.login .notice-error {
	border-right-color: #bd5260;
	background: #fff4f5;
}

.login .success,
.login .notice-success {
	border-right-color: #4c9273;
	background: #f1faf6;
}

.login .privacy-policy-page-link {
	width: auto;
	margin: 1.2rem 0 0;
	text-align: center;
}

.login .password-input-wrapper,
.login .pw-weak {
	width: 100%;
}

.login #pass-strength-result {
	margin: 0 0 1rem;
	padding: .55rem;
	border: 0;
	border-radius: .65rem;
	font-size: .9rem;
}

.login .dashicons {
	font-family: dashicons !important;
}

.param-login-welcome {
	position: fixed;
	z-index: 1;
	inset: 0 50% 0 0;
	display: flex;
	align-items: flex-end;
	overflow: hidden;
	padding: clamp(3rem, 6vw, 6.5rem);
	direction: rtl;
	background-color: var(--param-login-primary-dark);
	background-image:
		radial-gradient(circle at 24% 18%, rgba(255, 255, 255, .28) 0 7%, transparent 7.3%),
		linear-gradient(145deg, var(--param-login-primary), var(--param-login-primary-dark));
	color: #fff;
}

.param-login-welcome::before {
	position: absolute;
	inset: 0;
	background-image: radial-gradient(rgba(255, 255, 255, .18) .7px, transparent .7px);
	background-size: 1.1rem 1.1rem;
	content: "";
	mask-image: linear-gradient(to bottom, #000, transparent 65%);
}

.param-login-welcome__content {
	position: relative;
	z-index: 3;
	max-width: 31rem;
}

.param-login-welcome__eyebrow {
	display: inline-flex;
	align-items: center;
	margin-bottom: 1rem;
	padding: .55rem .9rem;
	border: 1px solid rgba(255, 255, 255, .24);
	border-radius: 2rem;
	background: rgba(255, 255, 255, .1);
	font-size: .88rem;
	font-weight: 590;
	backdrop-filter: blur(.65rem);
}

.param-login-welcome h2 {
	max-width: 36rem;
	margin: 0 0 1rem;
	color: #fff;
	font-size: calc(clamp(2.2rem, 4vw, 4.3rem) + .1rem);
	font-weight: 700;
	line-height: 1.35;
}

.param-login-welcome h2 span {
	display: block;
	white-space: nowrap;
}

.param-login-2fa-hint {
	display: block;
	margin: -.6rem 0 1rem;
	color: var(--param-login-muted);
	font-size: .85rem;
	font-weight: 380;
	line-height: 1.75;
}

.login .param-login-2fa-message {
	border-right-color: var(--param-login-primary);
	background: var(--param-login-soft);
	color: #4f6644;
}

.login.param-login-2fa-step #loginform > p:first-child,
.login.param-login-2fa-step #loginform > .user-pass-wrap,
.login.param-login-2fa-step #loginform > .forgetmenot {
	display: none;
}

.login.param-login-2fa-step .param-login-2fa-field {
	margin: 0;
}

.login.param-login-2fa-step #param_2fa_code {
	direction: ltr;
	text-align: center;
	font-size: 1.25rem;
	font-weight: 650;
	letter-spacing: .12em;
}

.login .param-login-2fa-back {
	margin: .2rem 0 0;
	text-align: center;
}

.login .param-login-2fa-back a {
	color: var(--param-login-primary);
	font-size: .92rem;
	font-weight: 600;
	text-decoration: none;
}

.login.param-login-2fa-step #nav {
	display: none;
}

.param-login-welcome p {
	max-width: 29rem;
	margin: 0;
	color: rgba(255, 255, 255, .76);
	font-size: calc(clamp(.9rem, 1.2vw, 1.05rem) + .1rem);
	line-height: 2;
}

.param-login-welcome__features {
	display: flex;
	flex-wrap: wrap;
	gap: .7rem 1.3rem;
	margin-top: 1.6rem;
}

.param-login-welcome__features span {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	font-size: .9rem;
	font-weight: 580;
}

.param-login-welcome__features svg {
	width: 1.25rem;
	height: 1.25rem;
	padding: .16rem;
	border-radius: 50%;
	background: rgba(255, 255, 255, .14);
}

.param-login-welcome__orb {
	position: absolute;
	border: 1px solid rgba(255, 255, 255, .14);
	border-radius: 50%;
}

.param-login-welcome__orb--one {
	top: -8rem;
	right: -10rem;
	width: 31rem;
	height: 31rem;
}

.param-login-welcome__orb--two {
	top: 10%;
	left: -12rem;
	width: 28rem;
	height: 28rem;
	background: rgba(255, 255, 255, .025);
}

.param-login-welcome__art {
	position: absolute;
	top: clamp(4rem, 9vh, 7rem);
	left: 50%;
	width: min(22vw, 20rem);
	aspect-ratio: 1;
	transform: translateX(-50%);
}

.param-login-welcome__heart {
	position: absolute;
	top: 26%;
	left: 37%;
	width: 5.8rem;
	height: 5.8rem;
	color: color-mix(in srgb, var(--param-login-accent) 82%, #fff);
	filter: drop-shadow(0 1.5rem 2rem rgba(48, 67, 38, .24));
}

.param-login-welcome__line {
	position: absolute;
	border: 1px solid rgba(255, 255, 255, .25);
	border-radius: 50%;
}

.param-login-welcome__line--one {
	inset: 8% 7% 7% 8%;
	transform: rotate(20deg);
}

.param-login-welcome__line--two {
	inset: 17% 0 4% 16%;
	transform: rotate(-28deg);
}

@media (max-width: 960px) {
	body.login {
		justify-content: center;
		padding: 2rem 1.25rem;
		background:
			radial-gradient(circle at 12% 8%, color-mix(in srgb, var(--param-login-secondary) 30%, transparent), transparent 28%),
			#f8f5ef;
	}

	body.login #login {
		width: min(100%, 29rem);
		margin: auto;
	}

	.param-login-welcome {
		display: none;
	}
}

@media (max-width: 480px) {
	body.login {
		align-items: flex-start;
		padding: 1rem;
	}

	body.login #login {
		margin-top: 1rem;
		padding: 1.75rem 1.35rem 1.5rem;
		border-radius: 1.4rem;
	}

	.login h1 {
		margin-bottom: 1.25rem;
	}

	.param-login-intro h2 {
		font-size: 1.65rem;
	}

	.param-password-group {
		margin-inline: -.15rem;
		padding: .8rem;
	}

	.param-password-criteria {
		display: grid;
	}
}

@media (prefers-reduced-motion: reduce) {
	.login *,
	.login *::before,
	.login *::after {
		scroll-behavior: auto !important;
		transition-duration: .01ms !important;
	}
}