/* My Account page: WooCommerce's default markup gets no styling elsewhere in the theme,
   so it renders as a bare browser list. This brings it in line with the rest of the site. */

.woocommerce-account .ev-page-body .woocommerce {
	display: grid;
	grid-template-columns: 220px 1fr;
	gap: 32px;
	align-items: start;
}
.woocommerce-account .ev-page-body .woocommerce-MyAccount-navigation { grid-column: 1; grid-row: 1; }
.woocommerce-account .ev-page-body .woocommerce-MyAccount-content { grid-column: 2; grid-row: 1; }
@media (max-width: 760px) {
	.woocommerce-account .ev-page-body .woocommerce { grid-template-columns: 1fr; }
	.woocommerce-account .ev-page-body .woocommerce-MyAccount-navigation,
	.woocommerce-account .ev-page-body .woocommerce-MyAccount-content { grid-column: 1; }
	.woocommerce-account .ev-page-body .woocommerce-MyAccount-navigation { grid-row: 1; }
	.woocommerce-account .ev-page-body .woocommerce-MyAccount-content { grid-row: 2; }
}

/* WooCommerce's own stylesheet floats these two with fixed 30%/68% widths,
   which fights the grid layout above unless explicitly cleared here. */
.woocommerce-account .ev-page-body .woocommerce-MyAccount-navigation,
.woocommerce-account .ev-page-body .woocommerce-MyAccount-content {
	float: none;
	width: auto;
}

.woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
	border: 1px solid var(--ev-border);
	border-radius: 16px;
	padding: 10px;
	background: var(--ev-surface);
}
.woocommerce-MyAccount-navigation-link a {
	display: block;
	padding: 10px 14px;
	border-radius: 10px;
	color: var(--ev-text);
	text-decoration: none;
	font-weight: 600;
	font-size: 14px;
	transition: .2s;
}
.woocommerce-MyAccount-navigation-link a:hover { background: var(--ev-bg); }
.woocommerce-MyAccount-navigation-link.is-active a {
	background: var(--ev-accent);
	color: #fff;
}

.woocommerce-MyAccount-content {
	background: var(--ev-bg);
	border: 1px solid var(--ev-border);
	border-radius: 16px;
	padding: 24px;
}
.woocommerce-MyAccount-content p { color: var(--ev-text); }
.woocommerce-MyAccount-content mark { background: none; color: var(--ev-accent); font-weight: 700; }
.woocommerce-MyAccount-content a { color: var(--ev-accent); }

.woocommerce-MyAccount-content table.shop_table,
.woocommerce-orders-table {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 20px;
}
.woocommerce-MyAccount-content table.shop_table th,
.woocommerce-MyAccount-content table.shop_table td {
	padding: 12px 10px;
	border-bottom: 1px solid var(--ev-border);
	text-align: left;
	font-size: 14px;
}
.woocommerce-MyAccount-content table.shop_table th { color: var(--ev-muted); font-weight: 600; }

.woocommerce-MyAccount-content .woocommerce-Button,
.woocommerce-MyAccount-content button.button,
.woocommerce-MyAccount-content input.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 42px;
	padding: 0 20px;
	border-radius: 999px;
	background: var(--ev-accent);
	color: #fff;
	font-weight: 700;
	font-size: 14px;
	border: 0;
	cursor: pointer;
	text-decoration: none;
}

.woocommerce-MyAccount-content .woocommerce-Addresses { display: flex; flex-wrap: wrap; gap: 20px; }
.woocommerce-MyAccount-content .woocommerce-Address {
	flex: 1 1 260px;
	border: 1px solid var(--ev-border);
	border-radius: 14px;
	padding: 18px;
}
.woocommerce-MyAccount-content .woocommerce-Address-title {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin: 0 0 10px;
}

.woocommerce-MyAccount-content .woocommerce-form-row,
.woocommerce-MyAccount-content .form-row { margin: 0 0 14px; }
.woocommerce-MyAccount-content input[type="text"],
.woocommerce-MyAccount-content input[type="email"],
.woocommerce-MyAccount-content input[type="password"],
.woocommerce-MyAccount-content input[type="tel"],
.woocommerce-MyAccount-content select,
.woocommerce-MyAccount-content textarea {
	width: 100%;
	padding: 12px 14px;
	border: 1px solid var(--ev-border);
	border-radius: 12px;
	font-size: 14px;
	font-family: inherit;
	background: var(--ev-bg);
	color: var(--ev-text);
}
.woocommerce-MyAccount-content label { font-size: 14px; font-weight: 600; display: block; margin: 0 0 6px; }