/**
 * TradeSmith 2023 — wp-login.php
 *
 * Scope: body.login
 * Structure follows DOM: page → #login → #loginform → blocks (password, magic-link, actions)
 */

body.login {
	--login-font-family: "Open Sans", sans-serif;

	--login-color-bg: #F1F4F8;
	--login-color-surface: #ffffff;
	--login-color-text: #262930;
	--login-color-text-muted: #bcbcbc;
	--login-color-link: #3E92D6;
	--login-color-link-hover: #3E92D6;
	--login-color-link-accent: #17BCB8;
	--login-color-mess-bg: #EBF4FB;

	--login-color-primary: #e56600;
	--login-color-primary-hover: #cc5c00;
	--login-color-primary-text: #ffffff;

	--login-color-border: #D7DDE4;
	--login-color-input-bg: #ffffff;
	--login-color-input-text: #212b38;
	--login-color-focus-ring: #26293085;

	--login-color-notice-info: #17bcb8;
	--login-color-notice-error: #d63638;
	--login-color-notice-info-bg: rgba(23, 188, 184, 0.15);
	--login-color-notice-error-bg: rgba(214, 54, 56, 0.12);
	--login-color-overlay: rgba(255, 255, 255, 0.72);
	--login-color-spinner: rgb(229, 102, 0);
	--login-color-spinner-track: rgba(229, 102, 0, 0.18);

	--login-space-xs: 0.5rem;
	--login-space-sm: 0.75rem;
	--login-space-md: 1rem;
	--login-space-lg: 1.5rem;
	--login-space-xl: 2rem;

	--login-font-size-xs: 0.8125rem;
	--login-font-size-sm: 0.875rem;
	--login-font-size-md: 1rem;
	--login-font-size-lg: 1.125rem;
	--login-control-min-height: 2.5rem;
	--login-button-min-height: 2.75rem;
	--login-button-padding: 0.25rem 1.25rem;
	--login-panel-min-height: 21.875rem;
	--login-radius: 8px;
	--login-logo-width: 280px;
	--login-logo-height: 85px;
	--login-form-max-width: 30rem;
	--login-shadow-card: 0 5px 20px 0 #0000001A;
}

/* --------------------------------------------------------------------------
   Page
   -------------------------------------------------------------------------- */

body.login {
	font-family: var(--login-font-family);
	background-color: var(--login-color-bg) !important;
	color: var(--login-color-text);
	margin: auto;
	display: flex;
	flex-direction: column;
}

body.login::before,
body.login::after {
	display: none;
	content: none;
}

body.login #login {
	display: flex;
	flex-direction: column;
	background-color: var(--login-color-bg);
	width: 100%;
	max-width: var(--login-form-max-width);
    margin-bottom: auto;
    padding-bottom: 0;
    padding-top: 0;
}

/* --------------------------------------------------------------------------
   Block order
   -------------------------------------------------------------------------- */

body.login #login > #backtoblog {
	display: block;
	order: 1;
	text-align: left;
}

body.login #login > #backtoblog a{
	gap: var(--login-space-xs);
}

body.login #login > #backtoblog .login-backtoblog__label {
	padding-bottom: 2px;
}

body.login #backtoblog .magic-link-panel__back-icon {
	flex-shrink: 0;
	display: block;
}

body.login #login > .wp-login-logo {
	display: none;
}

body.login #login > #login_error,
body.login #login > #login_message,
body.login #login > .notice {
	order: 20;
}

body.login #login > #login_message {
	display: block;
}

body.login #login > #loginform {
	order: 30;
}

/* If nested form breaks DOM, remember/submit sit as #login children */
body.login #login > .forgetmenot {
	order: 35;
}

body.login #login > .submit {
	order: 36;
}

body.login #login > .login-divider {
	order: 40;
}

body.login #login > .login-alt {
	order: 41;
}

body.login #login > #nav {
	order: 50;
    text-align: left;
}

body.login #login > .privacy-policy-page-link {
	order: 60;
    text-align: left;
}

body.login #loginform {
	display: flex;
	flex-direction: column;
}

body.login #loginform > p {
	order: 10;
}

body.login #loginform > .user-pass-wrap {
	order: 20;
}

body.login #loginform > .login-actions {
	order: 30;
}

body.login #loginform > .forgetmenot {
	order: 30;
}

body.login #loginform > .submit {
	order: 31;
}

body.login #loginform > .login-divider {
	order: 40;
}

body.login #loginform > .login-alt {
	order: 41;
}

body.login #login > .magic-link-panel {
	order: 42;
}

/* --------------------------------------------------------------------------
   Notices (#login_message, SSO info, etc.)
   -------------------------------------------------------------------------- */

body.login #login_message.notice-info,
body.login .notice-info {
    border: 1px dashed var(--login-color-link) ;
	background-color: var(--login-color-mess-bg);
	color: #3C434A;
    border-radius: var(--login-radius);
}

body.login .notice-error {
	border-inline-start-color: var(--login-color-notice-error);
	background-color: var(--login-color-notice-error-bg);
}

/* --------------------------------------------------------------------------
   Login form shell (#loginform)
   -------------------------------------------------------------------------- */

body.login #loginform {
	margin: 0;
	padding: var(--login-space-lg) !important;
	border: 1px solid var(--login-color-border);
	border-radius: var(--login-radius);
	background-color: var(--login-color-surface);
	box-shadow: var(--login-shadow-card) !important;
}

body.login #loginform:not( .submited ):not( .login-is-loading )::before {
	display: none !important;
	content: none !important;
}

body.login :is(
	#loginform.login-is-loading,
	#loginform.submited,
	.magic-link-panel.login-is-loading
) {
	position: relative;
	pointer-events: none;
}

body.login :is(
	#loginform.login-is-loading,
	#loginform.submited,
	.magic-link-panel.login-is-loading
)::before {
	display: block !important;
	content: '' !important;
	position: absolute;
	inset: 0;
	border-radius: var(--login-radius);
	background: var(--login-color-overlay);
	z-index: 20;
}

body.login :is(
	#loginform.login-is-loading,
	#loginform.submited,
	.magic-link-panel.login-is-loading
)::after {
	display: block !important;
	content: '' !important;
	position: absolute;
	top: 50%;
	left: 50%;
	inline-size: 2.5rem;
	block-size: 2.5rem;
	margin-top: -1.25rem;
	margin-left: -1.25rem;
	border: 3px solid var(--login-color-spinner-track);
	border-top-color: var(--login-color-spinner);
	border-radius: 50%;
	animation: magic-link-spin 0.8s linear infinite;
	z-index: 21;
}

body.login #login.login-sso-pending {
	position: relative;
	min-height: var(--login-panel-min-height);
	pointer-events: none;
}

body.login #login.login-sso-pending::before {
	display: block !important;
	content: '' !important;
	position: absolute;
	inset: 0;
	border-radius: var(--login-radius);
	background: var(--login-color-overlay);
	z-index: 25;
}

body.login #login.login-sso-pending::after {
	display: block !important;
	content: '' !important;
	position: absolute;
	top: 50%;
	left: 50%;
	inline-size: 2.5rem;
	block-size: 2.5rem;
	margin-top: -1.25rem;
	margin-left: -1.25rem;
	border: 3px solid var(--login-color-spinner-track);
	border-top-color: var(--login-color-spinner);
	border-radius: 50%;
	animation: magic-link-spin 0.8s linear infinite;
	z-index: 26;
}

body.login #login.login-sso-pending #loginform {
	position: relative;
	pointer-events: none;
}

/* Root overlay already covers the form: suppress the inner form spinner to
   avoid a double preloader when both loading states are active at once. */
body.login #login.login-sso-pending :is( #loginform.login-is-loading, #loginform.submited )::before,
body.login #login.login-sso-pending :is( #loginform.login-is-loading, #loginform.submited )::after {
	display: none !important;
	content: none !important;
}

body.login #login.login-sso-pending .magic-link-panel {
	pointer-events: none;
}

/* --------------------------------------------------------------------------
   Form fields (shared)
   -------------------------------------------------------------------------- */

body.login :is(#loginform, #magic-link-cf7-form, .magic-link-form .wpcf7-form) label {
	color: var(--login-color-text);
	font-family: var(--login-font-family);
	font-size: var(--login-font-size-sm) !important;
	margin-bottom: 0 !important;
}

body.login :is(#loginform .input, #magic-link-cf7-form input, .magic-link-form .wpcf7-form input) {
	box-sizing: border-box;
	width: 100%;
	margin: 0;
	padding: 0.125rem 1rem;
	border: 1px solid var(--login-color-border) !important;
	border-radius: var(--login-radius);
	color: var(--login-color-input-text) !important;
	font-size: var(--login-font-size-md);
	line-height: 1.4;
	box-shadow: none;
	min-height: var(--login-control-min-height);
	margin-top: 4px;
}

body.login :is(#magic-link-cf7-form, .magic-link-form .wpcf7-form) input {
	margin-top: 6px;
}

body.login :is(#loginform .input, #magic-link-cf7-form input, .magic-link-form .wpcf7-form input):focus {
	border-color: var(--login-color-link) !important;
	/* outline: 2px solid var(--login-color-focus-ring); */
	outline-offset: 0;
}

body.login :is(#loginform > p, #magic-link-cf7-form p, .magic-link-form .wpcf7-form > p) {
	margin-block: 0 var(--login-space-md);
}

/* --------------------------------------------------------------------------
   Password field
   -------------------------------------------------------------------------- */

body.login .user-pass-wrap {
	margin-block-end: var(--login-space-md);
}

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

body.login .wp-hide-pw {
	position: absolute;
	inset-block-start: 50%;
	inset-inline-end: 0.25rem;
	transform: translateY(-50%);
}

body.login button .dashicons-visibility {
	color: var(--login-color-link) !important;
}

body.login .caps-warning {
	margin-block-start: var(--login-space-xs);
	color: var(--login-color-text-muted);
	font-size: var(--login-font-size-xs);
}

/* --------------------------------------------------------------------------
   Magic link (BEM: login-*, magic-link-*)
   -------------------------------------------------------------------------- */

body.login .login-divider {
	display: flex;
	align-items: center;
	gap: var(--login-space-sm);
	margin-block: var(--login-space-lg) var(--login-space-md);
	color: var(--login-color-text);
	font-size: var(--login-font-size-sm);
	font-weight: 600;
	letter-spacing: 0;
	text-transform: lowercase;
}

.button-login {
	display: flex;
	gap: 8px;
	justify-content: center;
	align-items: center;
	font-family: var(--login-font-family);
	color: var(--login-color-text);
	font-weight: 600;
}

body.login .login-alt__toggle {
	inline-size: 100%;
	min-block-size: var(--login-button-min-height);
}

body.login .login-alt__label,
body.login .login-alt__toggle:hover .login-alt__label,
body.login .login-alt__toggle:focus .login-alt__label {
	color: var(--login-color-text);
}

body.login .login-alt__actions {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--login-space-sm);
}

body.login .login-alt__actions .login-alt__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	inline-size: 100%;
	min-block-size: var(--login-button-min-height);
	margin: 0;
	text-align: center;
	text-decoration: none;
}

body.login .magic-link-panel {
	margin-block-start: var(--login-space-md);
	padding-block-start: var(--login-space-md);
	border-block-start: 1px solid var(--login-color-border);
	min-height: var(--login-panel-min-height);
	position: relative;
	overflow: visible;
}

body.login .magic-link-panel[hidden],
body.login .wpcf7-spinner {
	display: none !important;
}

body.login .magic-link-panel.is-visible {
	display: block;
}


@keyframes magic-link-spin {
	from {
		transform: rotate(0deg);
	}

	to {
		transform: rotate(360deg);
	}
}

body.login .magic-link-panel__back {
	display: inline-flex;
	align-items: center;
	gap: var(--login-space-xs);
	margin: 0 0 var(--login-space-xl);
	padding: 0;
	border: 0;
	background: none;
	color: #3e92d6;
	font-size: 13px;
	line-height: 1;
	cursor: pointer;
}

body.login .magic-link-panel__back:hover,
body.login .magic-link-panel__back:focus-visible {
	color: var(--login-color-link-hover);
}

body.login .magic-link-panel__back:hover .magic-link-panel__back-label,
body.login .magic-link-panel__back:focus-visible .magic-link-panel__back-label {
	text-decoration: underline;
}

body.login .magic-link-panel__back-icon {
	flex-shrink: 0;
	display: block;
}

body.login .magic-link-panel__title {
	display: flex;
	align-items: center;
	gap: var(--login-space-sm);
	margin: 0 0 var(--login-space-md);
}

body.login .magic-link-panel__title-icon {
	flex-shrink: 0;
	display: block;
	inline-size: 1rem;
	block-size: 1rem;
}

body.login .magic-link-panel__title-text {
	margin: 0;
	color: var(--login-color-text);
	font-family: var(--login-font-family);
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.3;
}

body.login .magic-link-panel__hint {
	margin: 0 0 var(--login-space-md);
	color: var(--login-color-text-muted);
	font-size: var(--login-font-size-xs);
	line-height: 1.5;
}

body.login .magic-link-form .wpcf7 form > p {
	margin-block-end: var(--login-space-md);
}

body.login .magic-link-form__field {
	position: relative;
	margin-block-end: var(--login-space-md);
}

body.login .magic-link-form__field .wpcf7-form-control-wrap {
	display: block;
}

body.login .magic-link-panel .wpcf7-not-valid-tip {
	display: block;
	position: static;
	margin-block-start: var(--login-space-xs);
	color: var(--login-color-notice-error);
	font-size: var(--login-font-size-xs);
	line-height: 1.4;
}

body.login .magic-link-panel input.wpcf7-not-valid,
body.login .magic-link-panel input.is-invalid {
	border-color: var(--login-color-notice-error);
}

body.login .magic-link-field-error {
	display: block;
	margin-block-start: var(--login-space-xs);
	color: var(--login-color-notice-error);
	font-size: var(--login-font-size-xs);
	line-height: 1.4;
}

body.login .magic-link-field-error[hidden] {
	display: none;
}

body.login .magic-link-result {
	margin-block-start: var(--login-space-md);
}

body.login .magic-link-result[hidden] {
	display: none;
}

body.login .magic-link-result__header {
	display: flex;
	align-items: center;
	gap: var(--login-space-xs);
	margin: 0 0 var(--login-space-sm);
}

body.login .magic-link-result__icon {
	display: none;
	flex-shrink: 0;
	line-height: 0;
}

body.login .magic-link-result__icon img {
	display: block;
}

body.login .magic-link-result__icon--error img {
	inline-size: 1rem;
	block-size: 1rem;
}

body.login .magic-link-result.is-success .magic-link-result__icon--success,
body.login .magic-link-result.is-error .magic-link-result__icon--error {
	display: inline-flex;
}

body.login .magic-link-result__title {
	margin: 0;
	color: var(--login-color-text);
	font-family: var(--login-font-family);
	font-size: var(--login-font-size-lg);
	font-weight: 600;
	line-height: 1.3;
	text-transform: capitalize;
}

body.login .magic-link-result__text {
	margin: 0 0 var(--login-space-lg);
	color: var(--login-color-text-muted);
	font-size: var(--login-font-size-sm);
	line-height: 1.6;
	white-space: pre-line;
}

body.login .magic-link-result__actions {
	display: flex;
	flex-direction: column;
	gap: var(--login-space-sm);
	align-items: end;
}

body.login .magic-link-result__link {
	display: inline-flex;
	align-items: center;
	gap: var(--login-space-xs);
	align-self: flex-start;
	padding: 0;
	border: 0;
	background: none;
	color: var(--login-color-link);
	font-size: var(--login-font-size-sm);
	line-height: 1.4;
	text-decoration: none;
	cursor: pointer;
	margin-block-end: 2rem;
}

body.login .magic-link-result__link:hover,
body.login .magic-link-result__link:focus-visible {
	color: var(--login-color-link-hover);
}

body.login .magic-link-result__link-label {
	color: var(--login-color-link-accent);
	text-decoration: none;
	font-size: 13px;
}

body.login .magic-link-result__link:hover .magic-link-result__link-label,
body.login .magic-link-result__link:focus-visible .magic-link-result__link-label {
	text-decoration: underline;
}

body.login .magic-link-result__link-icon,
body.login .magic-link-result__button-icon {
	flex-shrink: 0;
	line-height: 0;
}

body.login .magic-link-result__link-icon img,
body.login .magic-link-result__button-icon img {
	display: block;
}

body.login .magic-link-result__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--login-space-sm);
	inline-size: 100%;
	min-block-size: var(--login-button-min-height);
	border-width: 1px;
	border-style: solid;
	cursor: pointer;
	width: auto;
}

body.login .magic-link-result__button-label {
	line-height: 1.2;
}

body.login .magic-link-panel--result .magic-link-panel__back,
body.login .magic-link-panel--result .magic-link-panel__title,
body.login .magic-link-panel--result .magic-link-panel__hint,
body.login .magic-link-panel--result .magic-link-form {
	display: none;
}

/* CF7 adds this block by default; we use .wpcf7-not-valid-tip for field errors. */
body.login .magic-link-panel .wpcf7 form:not(.sent) .wpcf7-response-output {
	display: none !important;
}

body.login .magic-link-panel .wpcf7 form.sent .wpcf7-response-output {
	display: block;
	margin-block: var(--login-space-md) 0;
	padding: var(--login-space-sm) var(--login-space-md);
	border: 1px solid var(--login-color-notice-info);
	border-radius: var(--login-radius);
	background-color: var(--login-color-notice-info-bg);
	color: var(--login-color-text);
	font-size: var(--login-font-size-sm);
	line-height: 1.45;
}

/* Password login hidden while magic link panel is open */
body.login #login.login--magic-link #loginform {
	display: none;
}

body.login #login.login--magic-link .magic-link-panel:not([hidden]) {
	display: block;
	margin: 0;
	padding: var(--login-space-lg);
	border: 1px solid var(--login-color-border);
	border-radius: var(--login-radius);
	background-color: var(--login-color-surface);
	box-shadow: var(--login-shadow-card);
}

/* --------------------------------------------------------------------------
   Button utilities (theme overrides need !important on wp-login.php)
   -------------------------------------------------------------------------- */

body.login :is(
	#loginform .button-primary,
	#loginform input.button-primary,
	#loginform .button.button-primary,
	.login .button-primary,
	.magic-link-panel .magic-link-submit,
	.magic-link-panel input.magic-link-submit,
	.magic-link-panel input[type="submit"].magic-link-submit,
	.login-btn--primary
) {
	border: 1px solid var(--login-color-primary) !important;
	border-color: var(--login-color-primary) !important;
	background-color: var(--login-color-primary) !important;
	color: var(--login-color-primary-text) !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	text-shadow: none !important;
	box-shadow: none !important;
	-webkit-box-shadow: none !important;
	padding: var(--login-button-padding) !important;
	border-radius: var(--login-radius) !important;
	height: auto !important;
	min-height: var(--login-button-min-height);
	width: auto !important;
	line-height: 1.2;
}

body.login :is(
	#loginform .button-primary,
	#loginform input.button-primary,
	#loginform .button.button-primary,
	.login .button-primary,
	.magic-link-panel .magic-link-submit,
	.magic-link-panel input.magic-link-submit,
	.magic-link-panel input[type="submit"].magic-link-submit,
	.login-btn--primary
):hover,
body.login :is(
	#loginform .button-primary,
	#loginform input.button-primary,
	#loginform .button.button-primary,
	.login .button-primary,
	.magic-link-panel .magic-link-submit,
	.magic-link-panel input.magic-link-submit,
	.magic-link-panel input[type="submit"].magic-link-submit,
	.login-btn--primary
):focus {
	border-color: var(--login-color-primary-hover) !important;
	background-color: var(--login-color-primary-hover) !important;
	color: var(--login-color-primary-text) !important;
	box-shadow: none !important;
	-webkit-box-shadow: none !important;
}

body.login :is(#loginform .button-secondary, .login-btn--ghost) {
	background-color: transparent !important;
	color: var(--login-color-link) !important;
	box-shadow: none !important;
	-webkit-box-shadow: none !important;
	text-shadow: none !important;
	border-radius: var(--login-radius) !important;
	transform: none !important;
}

body.login :is(#loginform .button-secondary, .login-btn--ghost):hover,
body.login :is(#loginform .button-secondary, .login-btn--ghost):focus {
	color: var(--login-color-link-hover) !important;
	border-color: transparent !important;
	box-shadow: none !important;
	-webkit-box-shadow: none !important;
}

body.login :is(#loginform .button-login, .login-btn--outline) {
	border: 1px solid var(--login-color-border) !important;
	background-color: transparent !important;
	color: var(--login-color-link) !important;
	box-shadow: none !important;
	-webkit-box-shadow: none !important;
	text-shadow: none !important;
	border-radius: var(--login-radius) !important;
	transform: none !important;
	display: flex;
}

body.login :is(#loginform .button-login, .login-btn--outline):hover,
body.login :is(#loginform .button-login, .login-btn--outline):focus {
	border-color: var(--login-color-link) !important;
	color: var(--login-color-link-hover) !important;
	box-shadow: none !important;
	-webkit-box-shadow: none !important;
}

/* --------------------------------------------------------------------------
   Remember me & submit row
   -------------------------------------------------------------------------- */

body.login .login-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--login-space-md);
    margin-block-start: var(--login-space-md);
}

body.login .login-actions .forgetmenot,
body.login .login-actions .submit {
	margin: 0;
}

body.login .login-actions .forgetmenot {
	flex: 1 1 auto;
	min-inline-size: 0;
}

body.login .login-actions .submit {
	flex: 0 0 auto;
}

body.login .forgetmenot {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: var(--login-space-xs);
	margin-block: var(--login-space-md);
}

body.login .forgetmenot input[type="checkbox"] {
	order: 1;
	flex-shrink: 0;
	margin: 0;
}

body.login .forgetmenot label {
	order: 2;
	display: inline;
	margin: 0;
	font-weight: 400;
}

body.login #loginform .submit {
	margin-block-end: 0;
}

body.login :is(#magic-link-cf7-form, .magic-link-form .wpcf7-form) .magic-link-submit {
	width: auto !important;
}

body.login :is(#magic-link-cf7-form, .magic-link-form .wpcf7-form) p:has(.magic-link-submit) {
	text-align: right;
}

/* --------------------------------------------------------------------------
   Footer links (#nav, #backtoblog, privacy)
   -------------------------------------------------------------------------- */

body.login #nav,
body.login #backtoblog,
body.login .privacy-policy-page-link {
	margin-block-start: var(--login-space-md);
	padding: 0;
	text-align: center;
	font-weight: 600;
}

body.login #nav a,
body.login #backtoblog a,
body.login .privacy-policy-link {
	color: var(--login-color-link) !important;
	text-decoration: none;
}

body.login #backtoblog a {
	display: inline-flex;
	align-items: center;
	gap: var(--login-space-sm);
}

body.login #nav a:hover,
body.login #nav a:focus-visible,
body.login #backtoblog a:hover,
body.login #backtoblog a:focus-visible,
body.login .privacy-policy-link:hover,
body.login .privacy-policy-link:focus-visible {
	color: var(--login-color-link-hover);
}

body.login #backtoblog a:hover .login-backtoblog__label,
body.login #backtoblog a:focus-visible .login-backtoblog__label {
	text-decoration: underline;
}

/* --------------------------------------------------------------------------
   SSO footer (.sso-bellow-form)
   -------------------------------------------------------------------------- */

body.login .sso-bellow-form {
	width: var(--login-form-max-width) !important;
	text-align: left;
	margin-top: 0;
}

body.login .sso-bellow-form a {
	color: var(--login-color-link);
}

body.login .sso-bellow-form a:hover,
body.login .sso-bellow-form a:focus-visible {
	color: var(--login-color-link-hover);
}

.login-alt__icon {
    height: 18px;
}

body.login .hidden-fields-container {
    border: 0;
}

body.login .magic-link-panel .wpcf7,
body.login .magic-link-panel .magic-link-form {
	background: transparent;
}

body.login .magic-link-panel :is(#magic-link-cf7-form, form.wpcf7-form) {
	border: 0;
	box-shadow: none;
	background-color: rgb(255, 255, 255);
	background-color: var(--login-color-surface);
}

body.login .wpcf7 form:not(#magic-link-cf7-form) {
	border: 0;
	box-shadow: none;
}

body.login :is(#magic-link-cf7-form, .magic-link-form .wpcf7-form) {
	padding: 0;
}
/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 30rem) {
	body.login #login {
		padding-block: var(--login-space-lg);
		padding-inline: var(--login-space-sm);
	}

	body.login #loginform {
		padding: var(--login-space-md) !important;
	}

	body.login .wp-login-logo a,
	body.login h1 a {
		width: min(100%, var(--login-logo-width));
	}
}