/* Nexcore Commerce — conta de cliente.
   Estiliza as classes nativas do WooCommerce (não há templates substituídos),
   sempre dentro de .woocommerce-account para não sair desta página. */

.woocommerce-account .woocommerce {
	--ncc-account-nav: 240px;
	display: grid;
	grid-template-columns: var(--ncc-account-nav) minmax(0, 1fr);
	gap: calc(var(--ncc-gap) * 2);
	align-items: start;
	font-family: var(--ncc-font);
	color: var(--ncc-text);
}

/* O clearfix do WooCommerce (::before/::after) contaria como célula da
   grelha e empurraria o menu para a segunda coluna. */
.woocommerce-account .woocommerce::before,
.woocommerce-account .woocommerce::after { content: none; display: none; }

/* Menu à esquerda, conteúdo à direita; tudo o resto (avisos) por cima. */
.woocommerce-account .woocommerce > * { grid-column: 1 / -1; }
.woocommerce-account .woocommerce > .woocommerce-MyAccount-navigation { grid-column: 1; }
.woocommerce-account .woocommerce > .woocommerce-MyAccount-content { grid-column: 2; }

/* Título do tema na conta: o do Hello é de 40px e peso médio, maior que
   tudo o resto da loja. Fica do tamanho dos títulos das outras páginas. */
.woocommerce-account .page-header .entry-title,
.woocommerce-account .entry-header .entry-title {
	font-family: var(--ncc-font);
	font-size: clamp(24px, 4.5vw, 30px);
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: var(--ncc-text);
	margin: 0 0 16px;
}

/* Página de entrada (sem sessão): "A minha conta" não diz nada a quem ainda
   não entrou; os títulos das caixas ("Iniciar sessão", "Criar conta") chegam.
   Na recuperação da senha o título fica (é o único que a página tem). */
.woocommerce-account:not(.logged-in):not(.woocommerce-lost-password) .page-header,
.woocommerce-account:not(.logged-in):not(.woocommerce-lost-password) .entry-header { display: none; }

.woocommerce-account:not(.logged-in) .woocommerce {
	display: block;
	max-width: 960px;
	margin-inline: auto;
	padding-inline: clamp(12px, 3vw, 16px);
	box-sizing: border-box;
	container-type: inline-size;
}

/* As duas caixas: uma por baixo da outra; lado a lado quando há largura.
   O #customer_login ganha às regras das colunas e dos formulários do
   WooCommerce (.woocommerce .col2-set .col-1, .woocommerce form.login). */
.woocommerce-account #customer_login {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: calc(var(--ncc-gap) * 1.25);
	margin: clamp(12px, 3vw, 28px) 0 32px;
}
.woocommerce-account #customer_login::before,
.woocommerce-account #customer_login::after { content: none; display: none; }

@container (min-width: 720px) {
	.woocommerce-account #customer_login { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.woocommerce-account #customer_login > .u-column1,
.woocommerce-account #customer_login > .u-column2,
.woocommerce-account:not(.logged-in) .woocommerce > form.login {
	float: none;
	width: auto;
	max-width: none;
	margin: 0;
	padding: clamp(18px, 4vw, 26px);
	border: 1px solid var(--ncc-border);
	border-radius: var(--ncc-radius);
	background: var(--ncc-surface);
	box-sizing: border-box;
}

/* Sem registo na loja só há o formulário de entrada, sem colunas. */
.woocommerce-account:not(.logged-in) .woocommerce > form.login { max-width: 460px; margin-top: 8px; }

.woocommerce-account #customer_login form.login,
.woocommerce-account #customer_login form.register {
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
}

.woocommerce-account #customer_login h2,
.woocommerce-account:not(.logged-in) .woocommerce > h2 {
	font-family: var(--ncc-font);
	font-size: 20px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -0.01em;
	color: var(--ncc-text);
	margin: 0 0 14px;
}
.woocommerce-account:not(.logged-in) .woocommerce > h2 { font-size: clamp(22px, 4.5vw, 26px); margin-top: 8px; }

/* Menu */
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-content { float: none; width: auto; }

.woocommerce-account .woocommerce-MyAccount-navigation {
	position: sticky;
	top: calc(var(--wp-admin--admin-bar--height, 0px) + var(--ncc-gap));
	padding: calc(var(--ncc-gap) * 0.5);
	border: 1px solid var(--ncc-border);
	border-radius: var(--ncc-radius);
	background: var(--ncc-surface);
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Os temas dão espaço e linhas aos itens; aqui manda o link. */
.woocommerce-account .woocommerce-MyAccount-navigation li {
	margin: 0;
	padding: 0;
	border: 0;
	list-style: none;
}
.woocommerce-account .woocommerce-MyAccount-navigation li::before { content: none; }

.woocommerce-account .woocommerce-MyAccount-navigation-link a {
	display: block;
	padding: 0.65em 0.9em;
	border-radius: calc(var(--ncc-radius) * 0.75);
	color: var(--ncc-text);
	text-decoration: none;
	line-height: 1.3;
}

.woocommerce-account .woocommerce-MyAccount-navigation-link a:hover {
	background: color-mix(in srgb, var(--ncc-primary) 6%, transparent);
}

/* Especificidade alta de propósito: os temas sublinham o item ativo com
   seletores longos (li.is-active a). */
.woocommerce-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link a { text-decoration: none; }

.woocommerce-account .woocommerce-MyAccount-navigation-link.is-active a {
	background: var(--ncc-primary);
	color: var(--ncc-surface);
	font-weight: 600;
}

.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout {
	margin-top: calc(var(--ncc-gap) * 0.5);
	padding-top: calc(var(--ncc-gap) * 0.5);
	border-top: 1px solid var(--ncc-border);
}
.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout a { color: var(--ncc-muted); }

/* Botão do menu no telemóvel (account.js): no computador não se vê. */
.woocommerce-account .woocommerce .ncc-account-toggle { display: none; }

/* Painel: o texto do WooCommerce ("Olá … (não é …? Sair)", "No painel da sua
   conta pode ver…") sai; ficam os cartões. A classe só vai no painel com os
   cartões ligados (Module::body_class). */
body.ncc-account-dashboard .woocommerce-MyAccount-content > p { display: none; }

/* Conteúdo */
.woocommerce-account .woocommerce-MyAccount-content > :first-child { margin-top: 0; }
/* Links de texto; botões (incluindo os de bloco, .wp-element-button) têm as suas cores. */
.woocommerce-account .woocommerce-MyAccount-content a:not(.button):not(.wp-element-button):not(.ncc-account-card-link):not(.ncc-addr-btn):not(.ncc-addr-link) { color: var(--ncc-primary); }

/* Cartões do painel */
.ncc-account-cards {
	display: grid;
	/* Duas colunas no computador (4 cartões = 2 + 2), uma no telemóvel. */
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
	gap: var(--ncc-gap);
	margin-top: calc(var(--ncc-gap) * 1.5);
}

.ncc-account-card {
	display: flex;
	flex-direction: column;
	padding: var(--ncc-gap);
	border: 1px solid var(--ncc-border);
	border-radius: var(--ncc-radius);
	background: var(--ncc-surface);
}

.ncc-account-card-title {
	margin: 0 0 0.6em;
	font-size: 0.8em;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--ncc-muted);
}

.ncc-account-card-body { flex: 1; }
.ncc-account-card-body p { margin: 0 0 0.35em; }
.ncc-account-card-body address { font-style: normal; line-height: 1.5; }

.ncc-card-figure { font-size: 1.6em; font-weight: 700; line-height: 1.2; }
.ncc-card-meta { color: var(--ncc-muted); font-size: 0.9em; }

.ncc-account-card-link {
	margin-top: var(--ncc-gap);
	color: var(--ncc-primary);
	font-weight: 600;
	text-decoration: none;
}
.ncc-account-card-link:hover { text-decoration: underline; }
/* Temas como o Hello sublinham ".page-content a"; aqui é mais específico. */
.ncc-account-cards a.ncc-account-card-link { text-decoration: none; }
/* :hover, :focus e :active com a cor forçada: o Hello passa as ligações a #336 ao passar. */
.ncc-account-cards a.ncc-account-card-link:is(:hover, :focus, :active) { color: var(--ncc-primary); text-decoration: underline; }

/* Estado da encomenda */
.ncc-status {
	display: inline-block;
	padding: 0.15em 0.6em;
	border-radius: 999px;
	font-size: 0.85em;
	font-weight: 600;
	background: color-mix(in srgb, var(--ncc-muted) 14%, transparent);
	color: var(--ncc-text);
}
.ncc-status--processing,
.ncc-status--on-hold { background: color-mix(in srgb, var(--ncc-accent) 16%, transparent); }
.ncc-status--completed { background: color-mix(in srgb, var(--ncc-success) 16%, transparent); color: var(--ncc-success); }
.ncc-status--cancelled,
.ncc-status--failed,
.ncc-status--refunded { background: color-mix(in srgb, var(--ncc-danger) 12%, transparent); color: var(--ncc-danger); }

/* Tabelas (encomendas, transferências, faturas) */
.woocommerce-account .woocommerce-MyAccount-content table.shop_table {
	width: 100%;
	border: 1px solid var(--ncc-border);
	border-radius: var(--ncc-radius);
	border-collapse: separate;
	border-spacing: 0;
	overflow: hidden;
}
.woocommerce-account .woocommerce-MyAccount-content table.shop_table th,
.woocommerce-account .woocommerce-MyAccount-content table.shop_table td {
	box-sizing: border-box;
	padding: 0.8em 1em;
	border: 0;
	border-bottom: 1px solid var(--ncc-border);
	text-align: left;
	vertical-align: middle;
}
.woocommerce-account .woocommerce-MyAccount-content table.shop_table thead th {
	background: color-mix(in srgb, var(--ncc-primary) 4%, var(--ncc-surface));
	font-size: 0.85em;
	font-weight: 600;
	color: var(--ncc-muted);
}
.woocommerce-account .woocommerce-MyAccount-content table.shop_table tbody tr:last-child > * { border-bottom: 0; }
.woocommerce-account .woocommerce-MyAccount-content table.shop_table time,
.woocommerce-account .woocommerce-orders-table__cell-order-date,
.woocommerce-account .woocommerce-orders-table__cell-order-number { white-space: nowrap; }

/* Botões */
.woocommerce-account .woocommerce-MyAccount-content .button,
.woocommerce-account .woocommerce-MyAccount-content button[type="submit"]:not(.ncc-addr-link):not(.ncc-addr-btn) {
	display: inline-block;
	margin: 0.15em 0.25em 0.15em 0;
	padding: 0.55em 1em;
	border: 1px solid var(--ncc-primary);
	border-radius: var(--ncc-radius);
	background: var(--ncc-primary);
	color: var(--ncc-surface);
	font: inherit;
	font-size: 0.9em;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
}
.woocommerce-account .woocommerce-orders-table .button:not(.view),
.woocommerce-account .woocommerce-MyAccount-content .ncc-invoice-download {
	background: var(--ncc-surface);
	color: var(--ncc-primary);
}

/* Formulários (detalhes da conta, moradas) */
.woocommerce-account .woocommerce-MyAccount-content form .form-row { margin: 0 0 var(--ncc-gap); }
.woocommerce-account .woocommerce-MyAccount-content form label { display: block; margin-bottom: 0.3em; font-weight: 500; }
.woocommerce-account .woocommerce-MyAccount-content input.input-text,
.woocommerce-account .woocommerce-MyAccount-content select,
.woocommerce-account .woocommerce-MyAccount-content textarea {
	width: 100%;
	padding: 0.65em 0.8em;
	border: 1px solid var(--ncc-border);
	border-radius: calc(var(--ncc-radius) * 0.75);
	background: var(--ncc-surface);
	color: var(--ncc-text);
	font: inherit;
}
.woocommerce-account .woocommerce-MyAccount-content input.input-text:focus,
.woocommerce-account .woocommerce-MyAccount-content select:focus {
	outline: 2px solid color-mix(in srgb, var(--ncc-primary) 40%, transparent);
	outline-offset: 1px;
	border-color: var(--ncc-primary);
}
.woocommerce-account .woocommerce-MyAccount-content fieldset {
	margin: calc(var(--ncc-gap) * 1.5) 0;
	padding: var(--ncc-gap);
	border: 1px solid var(--ncc-border);
	border-radius: var(--ncc-radius);
}

/* Moradas lado a lado */
.woocommerce-account .woocommerce-Addresses {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: var(--ncc-gap);
}
.woocommerce-account .woocommerce-Addresses::before,
.woocommerce-account .woocommerce-Addresses::after { content: none; }
.woocommerce-account .woocommerce-Address {
	float: none;
	width: auto;
	padding: var(--ncc-gap);
	border: 1px solid var(--ncc-border);
	border-radius: var(--ncc-radius);
}
.woocommerce-account .woocommerce-Address address { font-style: normal; line-height: 1.5; }

/* Moradas na página da encomenda: espaço entre faturação e envio quando empilham. */
.woocommerce-account .woocommerce-customer-details .woocommerce-column { margin-bottom: calc(var(--ncc-gap) * 1.5); }
.woocommerce-account .woocommerce-customer-details address { border-radius: var(--ncc-radius); }

.ncc-account-empty { color: var(--ncc-muted); }
.ncc-table-scroll { overflow-x: auto; }
.ncc-invoices-table td:first-child { white-space: nowrap; font-weight: 600; }
.ncc-account-pagination { margin-top: var(--ncc-gap); }

/* Telemóvel: menu em cima, a deslizar; tabelas em cartões */
@media (max-width: 768px) {
	.woocommerce-account .woocommerce { display: block; }

	/* Avisos do WooCommerce: o botão flutua à direita e tapa o texto num
	   ecrã estreito. Passa para baixo do texto. */
	.woocommerce-account .woocommerce .woocommerce-info .button,
	.woocommerce-account .woocommerce .woocommerce-message .button,
	.woocommerce-account .woocommerce .woocommerce-error .button {
		float: none;
		display: table;
		margin: 0.6em 0 0;
	}

	.woocommerce-account .woocommerce-MyAccount-navigation {
		position: static;
		margin-bottom: var(--ncc-gap);
		padding: 0;
		border: 0;
		background: none;
	}
	.woocommerce-account .woocommerce-MyAccount-navigation ul {
		flex-direction: row;
		gap: 6px;
		overflow-x: auto;
		padding-bottom: 4px;
		scrollbar-width: thin;
		-webkit-overflow-scrolling: touch;
	}
	.woocommerce-account .woocommerce-MyAccount-navigation-link a {
		white-space: nowrap;
		border: 1px solid var(--ncc-border);
		border-radius: 999px;
		padding: 0.5em 0.9em;
	}
	.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout {
		margin: 0;
		padding: 0;
		border: 0;
	}

	/* Com JS: "☰ Painel ▾" e a lista das secções por baixo, só quando aberta
	   (em vez dos botões a deslizar). Cores forçadas em todos os estados: o
	   Hello pinta os botões de rosa. */
	.woocommerce-account .woocommerce .ncc-account-toggle:not([hidden]),
	.woocommerce-account .woocommerce .ncc-account-toggle:not([hidden]):is(:hover, :focus, :active) {
		display: flex;
		align-items: center;
		gap: 10px;
		width: 100%;
		margin: 0 0 8px;
		padding: 12px 14px;
		border: 1px solid var(--ncc-border);
		border-radius: var(--ncc-radius);
		background: var(--ncc-surface);
		box-shadow: none;
		color: var(--ncc-text);
		font-family: var(--ncc-font);
		font-size: 16px;
		font-weight: 600;
		line-height: 1.3;
		text-align: left;
		text-transform: none;
		cursor: pointer;
	}
	.woocommerce-account .woocommerce .ncc-account-toggle:focus-visible { outline: 3px solid color-mix(in srgb, var(--ncc-primary) 35%, transparent); outline-offset: 2px; }
	.woocommerce-account .ncc-account-toggle svg { flex: none; color: var(--ncc-primary); }
	.woocommerce-account .ncc-account-toggle-label { flex: 1 1 auto; min-width: 0; }
	.woocommerce-account .ncc-account-toggle-chevron { transition: transform 0.15s; }
	.woocommerce-account .ncc-account-toggle[aria-expanded="true"] .ncc-account-toggle-chevron { transform: rotate(180deg); }
	.woocommerce-account .ncc-account-toggle .screen-reader-text {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
		white-space: nowrap;
	}

	.woocommerce-account .woocommerce-MyAccount-navigation.ncc-account-nav-js:not(.is-open) { display: none; }
	.woocommerce-account .woocommerce-MyAccount-navigation.ncc-account-nav-js {
		padding: 6px;
		border: 1px solid var(--ncc-border);
		border-radius: var(--ncc-radius);
		background: var(--ncc-surface);
	}
	.woocommerce-account .woocommerce-MyAccount-navigation.ncc-account-nav-js ul {
		flex-direction: column;
		gap: 2px;
		overflow: visible;
		padding-bottom: 0;
	}
	.woocommerce-account .woocommerce-MyAccount-navigation.ncc-account-nav-js .woocommerce-MyAccount-navigation-link a {
		white-space: normal;
		border: 0;
		border-radius: calc(var(--ncc-radius) * 0.75);
		padding: 0.7em 0.9em;
	}
	.woocommerce-account .woocommerce-MyAccount-navigation.ncc-account-nav-js .woocommerce-MyAccount-navigation-link--customer-logout {
		margin-top: 4px;
		padding-top: 4px;
		border-top: 1px solid var(--ncc-border);
	}

	/* O WooCommerce põe o número da encomenda num <th> dentro do corpo: conta como célula. */
	.woocommerce-account .woocommerce-MyAccount-content table.shop_table_responsive,
	.woocommerce-account .woocommerce-MyAccount-content table.shop_table_responsive tbody,
	.woocommerce-account .woocommerce-MyAccount-content table.shop_table_responsive tr,
	.woocommerce-account .woocommerce-MyAccount-content table.shop_table_responsive td,
	.woocommerce-account .woocommerce-MyAccount-content table.shop_table_responsive tbody th { display: block; width: auto; }
	.woocommerce-account .woocommerce-MyAccount-content table.shop_table_responsive { border: 0; overflow: visible; }
	.woocommerce-account .woocommerce-MyAccount-content table.shop_table_responsive thead { display: none; }
	.woocommerce-account .woocommerce-MyAccount-content table.shop_table_responsive tr {
		margin-bottom: var(--ncc-gap);
		border: 1px solid var(--ncc-border);
		border-radius: var(--ncc-radius);
		overflow: hidden;
	}
	/* Rótulo à esquerda, valor à direita, sem partir o valor em bocados
	   ("51,84 € por 2 itens" é um só texto). */
	.woocommerce-account .woocommerce-MyAccount-content table.shop_table_responsive td,
	.woocommerce-account .woocommerce-MyAccount-content table.shop_table_responsive tbody th {
		text-align: right;
		overflow-wrap: anywhere;
	}
	.woocommerce-account .woocommerce-MyAccount-content table.shop_table_responsive tbody th {
		background: color-mix(in srgb, var(--ncc-primary) 4%, var(--ncc-surface));
		border-bottom: 1px solid var(--ncc-border);
		font-weight: 600;
	}
	.woocommerce-account .woocommerce-MyAccount-content table.shop_table_responsive td[data-title]::before,
	.woocommerce-account .woocommerce-MyAccount-content table.shop_table_responsive tbody th[data-title]::before {
		content: attr(data-title);
		float: left;
		margin-right: var(--ncc-gap);
		font-weight: 600;
		color: var(--ncc-muted);
		text-align: left;
	}
	.woocommerce-account .woocommerce-MyAccount-content table.shop_table_responsive td:not([data-title]) { text-align: left; }
	.woocommerce-account .woocommerce-MyAccount-content table.shop_table_responsive tbody tr:last-child > * { border-bottom: 1px solid var(--ncc-border); }
	.woocommerce-account .woocommerce-MyAccount-content table.shop_table_responsive tr > :last-child { border-bottom: 0; }
}
