/* MegaPets: branded placement around Nextend's official provider skin. */

.mp-social-login {
	width: 100%;
	margin: 18px 0 0;
}

body.mp-my-account-auth-page .woocommerce #customer_login
	form.login:has(> .mp-social-login__lost-password)
	> .lost_password:not(.mp-social-login__lost-password) {
	display: none;
}

.mp-social-login__buttons {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.mp-social-login div.nsl-container,
.mp-social-login div.nsl-container .nsl-container-buttons,
.mp-social-login div.nsl-container .nsl-container-buttons > a[data-plugin="nsl"] {
	width: 100%;
	max-width: none;
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

.mp-social-login div.nsl-container .nsl-container-buttons {
	display: flex;
}

.mp-social-login div.nsl-container .nsl-container-buttons > a[data-plugin="nsl"] {
	border-radius: var(--mp-radius, 8px);
}

.mp-social-login div.nsl-container .nsl-button {
	min-height: 46px;
	overflow: hidden;
	border-radius: var(--mp-radius, 8px);
	transition:
		background-color var(--mp-duration-fast, 0.18s) ease,
		box-shadow var(--mp-duration-fast, 0.18s) ease;
}

.mp-social-login div.nsl-container .nsl-button-default {
	align-items: center;
}

.mp-social-login div.nsl-container .nsl-button-svg-container {
	flex: 0 0 46px;
	justify-content: center;
	width: 46px;
	height: 46px;
	box-sizing: border-box;
	padding: 11px;
}

.mp-social-login div.nsl-container .nsl-button-svg-container svg {
	width: 24px;
	height: 24px;
}

.mp-social-login div.nsl-container
	.nsl-button-google
	.nsl-button-label-container {
	display: flex;
	min-height: 46px;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	margin: 0 46px 0 0;
	padding: 0;
	font-family: "Roboto Medium", Roboto, "Helvetica Neue", Arial, sans-serif !important;
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;
	letter-spacing: 0.1px;
	white-space: normal;
	overflow: visible;
	text-overflow: clip;
	min-width: 0;
}

.mp-social-login div.nsl-container
	.nsl-button-google[data-skin="light"] {
	background-color: #fff !important;
	box-shadow: inset 0 0 0 1px #747775;
	color: #1f1f1f;
}

.mp-social-login a[data-plugin="nsl"]:hover
	.nsl-button-google[data-skin="light"] {
	background-color: #f8f9fa !important;
	box-shadow:
		inset 0 0 0 1px #747775,
		0 2px 7px rgba(42, 34, 27, 0.10);
}

.mp-social-login a[data-plugin="nsl"]:active
	.nsl-button-google[data-skin="light"] {
	background-color: #f1f3f4 !important;
	box-shadow: inset 0 0 0 1px #747775;
}

.mp-social-login a[data-plugin="nsl"]:focus-visible {
	outline: 2px solid var(--mp-color-action-primary-active-dark, #8a5c20);
	outline-offset: 3px;
}

.mp-social-login__separator {
	display: none;
	align-items: center;
	gap: 11px;
	margin: 15px 0;
	color: var(--mp-color-grey, #6d655e);
	font-size: 12px;
	line-height: 1;
	text-align: center;
}

.mp-social-login__separator::before,
.mp-social-login__separator::after {
	flex: 1;
	height: 1px;
	background: var(--mp-standard-separator-line-color, #e2d7c8);
	content: "";
}

.mp-social-login__separator > span {
	flex: none;
}

@media (max-width: 767px) {
	body.mp-my-account-auth-page .woocommerce #customer_login
		form.login > .mp-social-login,
	body.mp-my-account-auth-page .woocommerce #customer_login
		form.register > .mp-social-login {
		margin: 0 0 12px;
	}

	.mp-social-login__separator {
		display: flex;
		margin: 3px 0 15px;
	}

	.mp-social-login div.nsl-container .nsl-button,
	.mp-social-login div.nsl-container
		.nsl-button-google
		.nsl-button-label-container {
		min-height: 48px;
	}

	.mp-social-login div.nsl-container .nsl-button-svg-container {
		flex-basis: 48px;
		width: 48px;
		height: 48px;
		padding: 12px;
	}

	.mp-social-login div.nsl-container
		.nsl-button-google
		.nsl-button-label-container {
		margin-right: 48px;
	}
}

@media (min-width: 768px) {
	body.mp-my-account-auth-page .woocommerce #customer_login
		form.login:has(> .mp-social-login),
	body.mp-my-account-auth-page .woocommerce #customer_login
		form.register:has(> .mp-social-login) {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-auto-flow: row dense;
		column-gap: 12px;
	}

	body.mp-my-account-auth-page .woocommerce #customer_login
		form.login:has(> .mp-social-login) > *,
	body.mp-my-account-auth-page .woocommerce #customer_login
		form.register:has(> .mp-social-login) > * {
		min-width: 0;
		grid-column: 1 / -1;
	}

	body.mp-my-account-auth-page .woocommerce #customer_login form.login
		> p.form-row:has(> button.woocommerce-form-login__submit),
	body.mp-my-account-auth-page .woocommerce #customer_login form.register
		> p.form-row:has(> button.woocommerce-form-register__submit) {
		display: contents;
	}

	body.mp-my-account-auth-page .woocommerce #customer_login form.login
		> p.form-row > .woocommerce-form-login__rememberme {
		min-width: 0;
		grid-column: 1 / -1;
		margin: 0 0 12px;
	}

	body.mp-my-account-auth-page .woocommerce #customer_login form.login
		> p.form-row > button.woocommerce-form-login__submit,
	body.mp-my-account-auth-page .woocommerce #customer_login form.register
		> p.form-row > button.woocommerce-form-register__submit {
		width: 100%;
		min-width: 0;
		grid-column: 1;
		align-self: start;
		margin: 2px 0 12px;
		float: none;
	}

	body.mp-my-account-auth-page .woocommerce #customer_login
		form.login > .mp-social-login,
	body.mp-my-account-auth-page .woocommerce #customer_login
		form.register > .mp-social-login {
		min-width: 0;
		grid-column: 2;
		align-self: start;
		margin: 2px 0 12px;
	}

	.mp-social-login__separator {
		display: none;
	}
}

@media (forced-colors: active) {
	.mp-social-login div.nsl-container
		.nsl-button-google[data-skin="light"] {
		border: 1px solid ButtonText;
		box-shadow: none;
	}
}