/** Native WooCommerce account, consuming the shared AvelCoop palette. */
.woocommerce-account .woocommerce {
	color: var(--avelcoop-text-primary);
	font: 16px/1.55 var(--avelcoop-font-family);
	background: var(--avelcoop-bg-page);
	padding: 36px 32px;
	border-radius: 12px;
	container-type: inline-size;
}
.woocommerce-account .woocommerce:has(.woocommerce-MyAccount-navigation) {
	display: grid;
	grid-template-columns: 230px minmax(0, 1fr);
	gap: 42px;
}
.woocommerce-account .woocommerce *, .woocommerce-account .woocommerce *::before { box-sizing: border-box; }
.woocommerce-account .woocommerce .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce .woocommerce-MyAccount-content { float: none; width: auto; min-width: 0; }
/* Its own container context: table breakpoints below must react to this column's width, not the outer grid's (which also counts the 230px nav sidebar). */
.woocommerce-account .woocommerce .woocommerce-MyAccount-content { container-type: inline-size; }
.woocommerce-account .woocommerce .woocommerce-MyAccount-navigation ul { padding: 0; margin: 0; list-style: none; }
.woocommerce-account .woocommerce .woocommerce-MyAccount-navigation li { margin: 0; padding: 0; border-bottom: 1px solid var(--avelcoop-border-color); }
.woocommerce-account .woocommerce .woocommerce-MyAccount-navigation a { display: block; padding: 15px 14px; color: var(--avelcoop-text-primary); text-decoration: none; }
.woocommerce-account .woocommerce .woocommerce-MyAccount-navigation .is-active a { color: var(--avelcoop-accent-color); background: var(--avelcoop-soft); box-shadow: inset 4px 0 var(--avelcoop-accent-color); }
.woocommerce-account .woocommerce .woocommerce-MyAccount-navigation a:hover { background: var(--avelcoop-soft); }
.woocommerce-account .woocommerce h1 { margin: 8px 0 22px; font-size: 32px; line-height: 1.18; font-weight: 500; letter-spacing: -.025em; }
.woocommerce-account .woocommerce h2, .woocommerce-account .woocommerce h3 { font-size: 21px; line-height: 1.25; font-weight: 500; margin: 0 0 16px; }
.woocommerce-account .woocommerce p { margin: 0 0 18px; }
.woocommerce-account .woocommerce a { color: var(--avelcoop-accent-color); text-underline-offset: 4px; }
.woocommerce-account .woocommerce .button { font: inherit; min-height: 44px; padding: 10px 16px; border: 1px solid var(--avelcoop-border-color); border-radius: 8px; background: var(--avelcoop-bg-surface); color: var(--avelcoop-text-primary); text-decoration: none; }
.woocommerce-account .woocommerce button[type=submit], .woocommerce-account .woocommerce .avelcoop-create-profile, .woocommerce-account .woocommerce .avelcoop-certificate-download { background: var(--avelcoop-primary-color); color: var(--avelcoop-on-accent-color); border-color: var(--avelcoop-primary-color); }
.woocommerce-account .woocommerce input:not([type=checkbox]):not([type=radio]), .woocommerce-account .woocommerce select { font: inherit; width: 100%; min-width: 0; min-height: 46px; padding: 10px 12px; border: 1px solid var(--avelcoop-border-color); border-radius: 7px; color: var(--avelcoop-text-primary); background: var(--avelcoop-bg-surface); }
.woocommerce-account .woocommerce :is(a,button,input,select):focus-visible { outline: 2px solid var(--avelcoop-accent-color); outline-offset: 3px; }
.woocommerce-account .woocommerce .avelcoop-eyebrow { font-size: 12px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--avelcoop-accent-color); margin-bottom: 10px; }
.avelcoop-account-cards { display: grid; gap: 12px; margin-top: 28px; }
.woocommerce-account .woocommerce .avelcoop-account-card { display: grid; grid-template-columns: 38px 1fr auto; gap: 18px; align-items: center; padding: 18px; border: 1px solid var(--avelcoop-border-color); background: var(--avelcoop-bg-surface); border-radius: 8px; color: var(--avelcoop-text-primary); text-decoration: none; }
.avelcoop-account-card small { display: block; font-size: 13px; margin-top: 4px; color: var(--avelcoop-muted); }
.avelcoop-account-icon { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: var(--avelcoop-soft); color: var(--avelcoop-accent-color); }
.avelcoop-account-panel { padding: 24px; margin-bottom: 20px; background: var(--avelcoop-bg-surface); border: 1px solid var(--avelcoop-border-color); border-radius: 12px; }
.avelcoop-subscription-head { display: flex; justify-content: space-between; gap: 20px; }
.avelcoop-subscription-head > strong { font-size: 26px; }
.avelcoop-profile-tag { display: inline-block; background: var(--avelcoop-soft); color: var(--avelcoop-accent-color); padding: 5px 9px; border-radius: 20px; font-size: 12px; margin-bottom: 16px; }
.woocommerce-account .woocommerce :is(table.shop_table, .avelcoop-holdings-table) { border: 1px solid var(--avelcoop-border-color); border-radius: 12px; background: var(--avelcoop-bg-surface); border-collapse: separate; border-spacing: 0; width: 100%; }
.woocommerce-account .woocommerce :is(table.shop_table, .avelcoop-holdings-table) :is(td,th) { padding: 14px; border-color: var(--avelcoop-border-color); text-align: left; }
.avelcoop-table-wrap { overflow-x: auto; max-width: 100%; }
.avelcoop-table-wrap .button { white-space: nowrap; }
/* Centered in its cell in both table mode (desktop) and card mode (the @container block below). */
.woocommerce-account .woocommerce :is(table.shop_table, .avelcoop-holdings-table) td:has(.avelcoop-certificate-download) { text-align: center; }

/*
 * Below this width the holdings/certificates tables (up to 6 columns) no
 * longer fit their content column, and a horizontal scrollbar on a data
 * table — especially one hiding an actual download button — is too easy to
 * miss. Restacking each row as a labeled card removes the scroll need
 * entirely instead of just technically containing it. Reacts to the
 * container's own width (`.woocommerce-account .woocommerce` declares
 * `container-type: inline-size`), not the viewport, so it also triggers
 * correctly next to the 230px account nav sidebar on a merely-narrow
 * desktop window, not only on phones.
 */
@container (max-width: 820px) {
	.avelcoop-table-wrap { overflow-x: visible; }
	.avelcoop-holdings-table, .avelcoop-holdings-table tbody, .avelcoop-holdings-table tr, .avelcoop-holdings-table td { display: block; width: 100%; }
	.avelcoop-holdings-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
	.avelcoop-holdings-table tr { padding: 6px 14px; border-bottom: 1px solid var(--avelcoop-border-color); }
	.avelcoop-holdings-table tr:last-child { border-bottom: none; }
	.avelcoop-holdings-table td { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 8px 0; border: none; text-align: right; }
	.avelcoop-holdings-table td::before { content: attr(data-label); font-weight: 600; color: var(--avelcoop-muted); text-align: left; }
	/* A cell holding a full-width action (the certificate download button) reads better stacked than squeezed next to its label. */
	.avelcoop-holdings-table td:has(.button) { display: block; text-align: left; }
	.avelcoop-holdings-table td:has(.button)::before { display: block; margin-bottom: 6px; }
}

@media (max-width: 900px) {
	.woocommerce-account .woocommerce:has(.woocommerce-MyAccount-navigation) { grid-template-columns: 1fr; gap: 24px; }
	.woocommerce-account .woocommerce .woocommerce-MyAccount-navigation ul { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--avelcoop-border-color); border-radius: 10px; overflow: hidden; }
	.woocommerce-account .woocommerce .woocommerce-MyAccount-navigation a { padding: 11px 12px; font-size: 13px; }
	.woocommerce-account .woocommerce .woocommerce-MyAccount-navigation .is-active a { box-shadow: inset 0 3px var(--avelcoop-accent-color); }
}
@media (max-width: 640px) {
	.woocommerce-account .woocommerce { padding: 26px 18px; }
	.woocommerce-account .woocommerce h1 { font-size: 27px; }
	.avelcoop-account-panel { padding: 18px; }
	.avelcoop-subscription-head { flex-direction: column; }
}

/* WooCommerce clearfix pseudo-elements must not occupy grid cells. */
.woocommerce-account .woocommerce:has(.woocommerce-MyAccount-navigation)::before,
.woocommerce-account .woocommerce:has(.woocommerce-MyAccount-navigation)::after { display: none; }

.avelcoop-subscription-progress { margin: 28px 0 20px; }
.avelcoop-subscription-progress > div { display: flex; justify-content: space-between; gap: 20px; padding: 15px 0; border-bottom: 1px solid var(--avelcoop-border-color); }
.avelcoop-subscription-progress dd { margin: 0; text-align: right; color: var(--avelcoop-muted); }
.avelcoop-subscription-actions { display: flex; flex-wrap: wrap; gap: 12px 24px; }
