/* ─── EcoClean Auth Pages (Login / Register / My Account) ───────
   File: assets/css/ec-auth.css
   Reuses .ec-checkout-form's input styling from ec-cart.css. Load AFTER
   both the main theme stylesheet and ec-cart.css. */

.ec-auth-section { display: flex; justify-content: center; }
.ec-auth-wrap {
	max-width: 440px;
	width: 100%;
	background: var(--cream);
	border: 1px solid var(--caramel-dk);
	border-radius: var(--r-xl);
	padding: var(--s7) var(--s6);
}
.ec-auth-wrap .section-title { font-size: 28px; margin-bottom: var(--s2); }
.ec-auth-sub {
	font-size: 13px;
	font-weight: 300;
	color: var(--bronze-deep);
	line-height: 1.6;
	margin-bottom: var(--s5);
}

.ec-auth-form { gap: var(--s4); margin-top: var(--s5); }
.ec-auth-form label { color: var(--bronze-deep); }

.ec-auth-notice {
	font-size: 13px;
	padding: var(--s3) var(--s4);
	border-radius: var(--r-md);
	margin-bottom: var(--s5);
}
.ec-auth-notice--ok {
	background: rgba(74,92,46,.08);
	border: 1px solid var(--sage);
	color: var(--sage);
}
.ec-auth-notice--error {
	background: rgba(227,83,54,.1);
	border: 1px solid var(--ember);
	color: var(--bronze-deep);
}

.ec-auth-links {
	margin-top: var(--s5);
	font-size: 13px;
	font-weight: 300;
	color: var(--bronze-deep);
	text-align: center;
}
.ec-auth-links a {
	color: var(--gold-deep);
	border-bottom: 1px solid var(--gold-mid);
}

.ec-auth-divider {
	display: flex;
	align-items: center;
	gap: var(--s3);
	margin: var(--s5) 0;
	font-family: var(--fm);
	font-size: 10px;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--sand);
}
.ec-auth-divider::before, .ec-auth-divider::after {
	content: '';
	flex: 1;
	height: 1px;
	background: var(--caramel-dk);
}

.ec-account-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--s4);
	margin-bottom: var(--s5);
}
.ec-account-tabs {
	display: flex;
	gap: var(--s5);
	border-bottom: 1px solid var(--caramel-dk);
	margin-bottom: var(--s5);
}
.ec-account-tabs a {
	font-family: var(--fm);
	font-size: 11px;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--bronze-deep);
	padding-bottom: var(--s3);
	border-bottom: 2px solid transparent;
	transition: color .2s, border-color .2s;
}
.ec-account-tabs a:hover { color: var(--gold-deep); }
.ec-account-tabs a.active { color: var(--gold-deep); border-color: var(--gold); }

.ec-order-list { display: flex; flex-direction: column; gap: var(--s3); }
.ec-order-card {
	border: 1px solid var(--caramel-dk);
	border-radius: var(--r-md);
	background: #fff;
	overflow: hidden;
}
.ec-order-card summary {
	display: grid;
	grid-template-columns: 1fr auto auto auto;
	gap: var(--s3);
	align-items: center;
	padding: var(--s4);
	cursor: pointer;
	font-size: 13px;
	list-style: none;
}
.ec-order-card summary::-webkit-details-marker { display: none; }
.ec-order-number { font-family: var(--fd); font-style: italic; color: var(--bark-deep); }
.ec-order-date { font-family: var(--fm); font-size: 11px; color: var(--sand); }
.ec-order-total { font-family: var(--fd); font-weight: 500; color: var(--bark-deep); }
.ec-order-status {
	font-family: var(--fm);
	font-size: 9px;
	letter-spacing: .08em;
	text-transform: uppercase;
	padding: 3px 10px;
	border-radius: var(--r-pill);
	color: #fff;
	text-align: center;
}
.ec-order-status--paid { background: #2E7D32; }
.ec-order-status--pending_payment { background: #B8860B; }
.ec-order-status--failed { background: #C62828; }
.ec-order-status--cancelled { background: #757575; }
.ec-order-status--refunded { background: #6A1B9A; }
.ec-order-items {
	padding: 0 var(--s4) var(--s4);
	font-size: 13px;
	color: var(--bronze-deep);
	list-style: disc;
	margin-left: var(--s4);
}

@media (max-width: 600px) {
	.ec-auth-wrap { padding: var(--s6) var(--s4); }
	.ec-order-card summary { grid-template-columns: 1fr 1fr; }
}