/* stylelint-disable selector-id-pattern */
/**
 * My Account
 * 
 */
.account-navigation {
	margin-bottom: var(--space-large);	
}

.wc-account-nav ul {
	list-style: none;
	margin: 0;
	padding: 0;	
}

.wc-account-nav li {
	padding: var(--space-xsmall) var(--space-normal);	
}

.wc-account-nav li.is-active {
	background-color: var(--gray-xlight);
}

.wc-account-nav a {
	color: inherit;
	font-weight: 700;
	text-decoration: none;
	white-space: nowrap;
}

@media(min-width: 45em){
	
	#customer_login.col2-set { 
		display: flex;	
	}

	#customer_login.col2-set .col-1 {
		width: 50%;
		padding-right: var(--space-normal);
	}

	#customer_login.col2-set .col-2 {
		width: 50%;
		padding-left: var(--space-normal);
	}
}

/* Account Pages start to have the account nav on the side at some point */
@media(min-width: 64em){
	
	.woocommerce-account .woocommerce {
		display: flex;
		flex-wrap: wrap;
	}
	
	.account-navigation {
		width: 22.5%;	
	}

	.woocommerce-MyAccount-content {
		padding-left: var(--space-xlarge);
		width: 77.5%;
	}
	
	/* Account nav doesn't toggle anymore */
	button.wc-account-nav-toggle {
		display: none;	
	}
	
	.wc-account-nav.toggled-off {
		visibility: visible;
		position: static;
		transform: none;
		opacity: 1;	
	}
	
}
label.woocommerce-form-login__rememberme {
	display: inline-block;
	font-size: 0.8888em;
	font-weight: 400;
	line-height: 1.5;
	margin-bottom: 1em;
}

#customer_login button {
	width: 100%;
}

.woocommerce-LostPassword {
	text-align: center;
}


/* Register form on my-account page gets light gray background-color */

/* Override parent theme styles */
#customer_login.col2-set {
	display: block;
}

#customer_login.col2-set .col-1,
#customer_login.col2-set .col-2 {
	width: auto;
}

/* Styles for this site */
#customer_login {
	margin: 0 auto;
	max-width: var(--max-width-wide);
	width: 100%;
}

.woocommerce-account.logged-out .entry-content {
	margin: 0;
	padding: 0;
}

.woocommerce-account.logged-out .entry-content .woocommerce-notices-wrapper {
	padding: 0 var(--gutter-width);
}

.woocommerce-account.logged-out .entry-content .woocommerce-notices-wrapper > * {
	margin: 0 auto;
	max-width: var(--max-width-wide);
}

#customer_login.col2-set .col-1 {
	padding: var(--space-large) var(--gutter-width);
}

#customer_login.col2-set .col-2 {
	padding: var(--space-xlarge) var(--gutter-width) var(--space-large);
}

#customer_login .col-2 {
	background-color: var(--gray-xlight);
}

/* These forms reach a max-width */
#customer_login h2,
#customer_login form {
	margin: 0 auto;
	max-width: 476px;
}


@media (min-width: 45em) {

	#customer_login.col2-set .col-1 {
		padding-bottom: var(--space-xxlarge);
		padding-top: var(--space-xlarge);
	}

	#customer_login.col2-set .col-2 {
		padding-bottom: var(--space-xxlarge);
		padding-top: var(--space-xxlarge);
	}

}

/* At some point these do go to columns */
@media (min-width: 64em) {

	.woocommerce-account.logged-out .entry-content {
		padding: 0 var(--gutter-width);
		position: relative;
	}

	.woocommerce-account.logged-out:not(.woocommerce-lost-password) .entry-content::after {
		background-color: var(--gray-xlight);
		bottom: 0;
		content: "";
		display: block;
		left: 50%;
		position: absolute;
		right: 0;
		top: -44px;
		z-index: -1;
	}

	.woocommerce-account.logged-out .entry-content .woocommerce-notices-wrapper {
		padding: 0;
	}

	#customer_login.col2-set {
		display: flex;
		justify-content: space-between;
	}

	#customer_login.col2-set .col-1 {
		padding-left: 0;
	}

	#customer_login.col2-set .col-2 {
		padding-right: 0;
		padding-top: var(--space-xlarge);
	}

}
