/* Keep every My Account section on one stable, fluid page axis. */
body.woocommerce-account main {
	--mc-account-page-gutter: clamp(1.75rem, 8vw, 5rem);
	box-sizing: border-box;
	padding-right: 0;
	padding-left: 0;
}

.woocommerce-account main .wp-block-post-title,
.woocommerce-account main .entry-content {
	box-sizing: border-box;
	width: min(calc(100% - 2 * var(--mc-account-page-gutter)), var(--mc-account-max));
	max-width: none;
	margin-right: auto;
	margin-left: auto;
}

/* My Account desktop structure. */
.woocommerce-account .entry-content > .woocommerce {
	display: flex;
	align-items: flex-start;
	gap: var(--mc-account-gap);
	width: 100%;
	max-width: none;
	margin: 0 auto;
	padding: 2rem 0;
}

/* The logged-out account root is one switchable authentication card. */
.woocommerce-account .entry-content > .woocommerce.mc-account-auth--enhanced {
	width: min(100%, 32rem);
}

/*
 * Authentication columns respond to their actual available width. The
 * 20-rem floor keeps each form usable and lets both columns narrow before
 * the grid naturally stacks them.
 */
.woocommerce-account .entry-content > .woocommerce > .u-columns.col2-set {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr));
	gap: clamp(1.5rem, 4vw, 3rem);
	width: 100%;
}

.woocommerce-account .entry-content > .woocommerce > .u-columns.col2-set::before,
.woocommerce-account .entry-content > .woocommerce > .u-columns.col2-set::after {
	display: none;
}

.woocommerce-account .entry-content > .woocommerce > .u-columns.col2-set > .u-column1,
.woocommerce-account .entry-content > .woocommerce > .u-columns.col2-set > .u-column2 {
	float: none;
	box-sizing: border-box;
	width: auto;
	min-width: 0;
}

.woocommerce-account .woocommerce-MyAccount-navigation {
	flex: 0 0 var(--mc-account-nav-width);
	margin: 0;
}

.woocommerce-account .woocommerce-MyAccount-content {
	flex: 1 1 auto;
	min-width: 0;
	margin: 0;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
	position: relative;
	margin: 0;
	padding: 0 1rem 0 0;
	list-style: none;
}

.woocommerce-account .woocommerce-MyAccount-navigation li + li {
	margin-top: 0.65rem;
}

.woocommerce-account .woocommerce-MyAccount-navigation a {
	color: var(--mc-subtle);
	text-decoration: none;
}

.woocommerce-account .woocommerce-MyAccount-navigation li.is-active > a {
	color: var(--mc-accent) !important;
	font-weight: 600;
}

@media (max-width: 781px) {
	body.woocommerce-account main > .has-global-padding {
		box-sizing: border-box;
		padding-right: max(var(--mc-header-gutter, 1rem), clamp(1.5rem, 7vw, 3.5rem)) !important;
		padding-left: max(var(--mc-header-gutter, 1rem), clamp(1.5rem, 7vw, 3.5rem)) !important;
	}

	.woocommerce-account main .wp-block-post-title,
	.woocommerce-account main .entry-content {
		width: 100%;
	}

	.woocommerce-account .entry-content > .woocommerce > .u-columns.col2-set {
		grid-template-columns: minmax(0, 1fr);
	}

	.woocommerce-account .entry-content > .woocommerce {
		display: block;
		width: 100%;
		padding-top: 1rem;
	}

	.woocommerce-account .woocommerce-MyAccount-navigation {
		margin-bottom: 2rem;
	}

	.woocommerce-account .woocommerce-MyAccount-navigation ul {
		display: flex;
		gap: 0.5rem 1rem;
		overflow-x: auto;
		padding: 0 0 0.75rem;
		scrollbar-width: thin;
	}

	.woocommerce-account .woocommerce-MyAccount-navigation li,
	.woocommerce-account .woocommerce-MyAccount-navigation li + li {
		flex: 0 0 auto;
		margin: 0;
	}
}
