/* My Account: flat panels, brand colour, theme font (tokens from sae-brand.css) */

.sae-account {
	font-family: var(--sae-font, inherit);
	color: var(--sae-text, #333);
}
.sae-account a {
	color: var(--sae-brand, #e88b4b);
}
.sae-welcome {
	background: #edf7ed;
	border-left: 4px solid #1e6b1e;
	padding: 10px 15px;
	border-radius: var(--sae-radius, 4px);
}
.sae-account-greeting {
	margin-bottom: 4px;
}

/* Dashboard: same card grid as earnings, but 2–4 tiles instead of a fixed 4 */
.sae-account-dashboard .sae-account-cards {
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}
.sae-account-dashboard a.sae-card {
	color: var(--sae-text, #333);
	text-decoration: none;
}
.sae-account-dashboard a.sae-card:hover,
.sae-account-dashboard a.sae-card:focus-visible {
	border-color: var(--sae-brand, #e88b4b);
	background: var(--sae-brand-soft, rgba(232, 139, 75, 0.1));
	box-shadow: none;
	color: var(--sae-text, #333);
}
.sae-account-card-text {
	font-size: 13px;
	color: var(--sae-muted, #666);
}

/* Side list stays hidden. The compact bar is the on-page menu (header dropdown is unchanged). */
.woocommerce-account nav.woocommerce-MyAccount-navigation {
	display: none;
}
.woocommerce-account .sae-account-tabs {
	margin: 0 0 20px;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}
.woocommerce-account .sae-account-tabs ul {
	display: flex;
	flex-wrap: nowrap;
	gap: 6px;
	list-style: none;
	margin: 0;
	padding: 0 0 2px;
}
.woocommerce-account .sae-account-tabs li {
	margin: 0;
	flex: 0 0 auto;
}
.woocommerce-account .sae-account-tabs a {
	display: block;
	white-space: nowrap;
	padding: 6px 12px;
	border: 1px solid var(--sae-border, #e5e5e5);
	border-radius: var(--sae-radius, 4px);
	background: #fff;
	color: var(--sae-text, #333);
	text-decoration: none;
	font-family: var(--sae-font, inherit);
	font-size: 13px;
	line-height: 1.3;
}
.woocommerce-account .sae-account-tabs a:hover,
.woocommerce-account .sae-account-tabs a:focus-visible {
	background: var(--sae-brand-soft, rgba(232, 139, 75, 0.1));
	color: var(--sae-brand, #e88b4b);
}
.woocommerce-account .sae-account-tabs li.is-active a,
.woocommerce-account .sae-account-tabs li.is-active a:hover {
	background: var(--sae-brand, #e88b4b);
	border-color: var(--sae-brand, #e88b4b);
	color: #fff;
}
.woocommerce-account .woocommerce-MyAccount-content {
	float: none;
	width: 100%;
}

/* Profile: same flat panel as the bank form. Selectors beat Pressroom
   (input { background:#F0F0F0; border:none } and .woocommerce input.button { transparent, square }). */
.woocommerce-account .woocommerce-EditAccountForm {
	max-width: 600px;
	margin: 20px auto;
	background: #fff;
	padding: 30px;
	border: 1px solid var(--sae-border, #e5e5e5);
	border-radius: var(--sae-radius, 4px);
	box-shadow: none;
	font-family: var(--sae-font, inherit);
	box-sizing: border-box;
}
.woocommerce-account .woocommerce-EditAccountForm .box_header {
	margin: 0 0 25px;
	padding: 0;
	background: transparent;
	border: 0;
	font-family: inherit;
	font-weight: inherit;
	text-align: center;
	color: var(--sae-text, #333);
}
.woocommerce-account .woocommerce-EditAccountForm label {
	font-weight: bold;
	margin-bottom: 5px;
	display: block;
	color: var(--sae-text, #333);
}
.woocommerce-account .woocommerce-EditAccountForm input[type="text"],
.woocommerce-account .woocommerce-EditAccountForm input[type="email"],
.woocommerce-account .woocommerce-EditAccountForm input[type="password"] {
	width: 100%;
	padding: 10px;
	margin: 0;
	border: 1px solid var(--sae-border, #e5e5e5);
	border-radius: var(--sae-radius, 4px);
	background: #fff;
	box-sizing: border-box;
	font-family: var(--sae-font, inherit);
	font-size: 14px;
	color: var(--sae-text, #333);
}
.woocommerce-account .woocommerce-EditAccountForm input.button {
	display: inline-block;
	width: auto;
	background-color: var(--sae-brand, #e88b4b);
	color: #fff;
	border: none;
	padding: 12px 20px;
	font-family: var(--sae-font, inherit);
	font-size: 16px;
	border-radius: var(--sae-radius, 4px);
	cursor: pointer;
	text-align: center;
}
.woocommerce-account .woocommerce-EditAccountForm input.button:hover {
	background-color: var(--sae-brand-dark, #cc7a42);
	color: #fff;
	border: none;
}

@media (max-width: 768px) {
	.sae-account-dashboard .sae-account-cards {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* Lost / reset password (WooCommerce endpoint, reached from "Forgot password?"): same card as the login form */
.woocommerce-account form.woocommerce-ResetPassword {
	max-width: 600px;
	margin: 20px auto;
	background: #fff;
	padding: 30px;
	border: 1px solid var(--sae-border, #e5e5e5);
	border-radius: var(--sae-radius, 4px);
	box-shadow: none;
	font-family: var(--sae-font, inherit);
	color: var(--sae-text, #333);
	box-sizing: border-box;
}
.woocommerce-account form.woocommerce-ResetPassword .form-row {
	float: none;
	width: 100%;
	padding: 0;
	margin: 0 0 20px;
}
.woocommerce-account form.woocommerce-ResetPassword label {
	display: block;
	font-weight: bold;
	margin-bottom: 5px;
	color: var(--sae-text, #333);
}
.woocommerce-account form.woocommerce-ResetPassword input.input-text {
	width: 100%;
	padding: 10px;
	border: 1px solid var(--sae-border, #e5e5e5);
	border-radius: var(--sae-radius, 4px);
	background: #fff;
	box-sizing: border-box;
	font-family: var(--sae-font, inherit);
	font-size: 14px;
	color: var(--sae-text, #333);
}
.woocommerce-account form.woocommerce-ResetPassword button.button,
.woocommerce-account form.woocommerce-ResetPassword button.button:not(:hover):not(:active):not(.has-background) {
	display: block;
	width: 100%;
	background: var(--sae-brand, #e88b4b);
	background-color: var(--sae-brand, #e88b4b);
	color: #fff;
	border: none;
	border-radius: var(--sae-radius, 4px);
	padding: 12px 20px;
	font-family: var(--sae-font, inherit);
	font-size: 16px;
	cursor: pointer;
	text-transform: none;
}
.woocommerce-account form.woocommerce-ResetPassword button.button:hover,
.woocommerce-account form.woocommerce-ResetPassword button.button:focus-visible {
	background: var(--sae-brand-dark, #cc7a42);
	background-color: var(--sae-brand-dark, #cc7a42);
	color: #fff;
}
.woocommerce-account .woocommerce-ResetPassword + p,
.woocommerce-account .woocommerce-message,
.woocommerce-account .woocommerce-info {
	max-width: 600px;
	margin-left: auto;
	margin-right: auto;
}