/**
 * Páginas de compra: carrinho, checkout, confirmação do pedido e Minha Conta.
 * Carregado só nessas páginas (inc/woocommerce.php).
 *
 * Minha Conta continua no shortcode clássico [woocommerce_my_account] (o WooCommerce
 * não tem bloco para ela); as classes woocommerce-MyAccount-* e woocommerce-*
 * usadas aqui são as classes públicas e estáveis dos templates clássicos.
 */

/* ---------- Título das páginas de compra ---------- */
.mdc-compra__titulo {
	margin-block: 0 var(--wp--preset--spacing--30);
	font-size: var(--wp--preset--font-size--xx-large);
}

.mdc-compra--checkout .mdc-compra__titulo {
	font-size: var(--wp--preset--font-size--x-large);
}

/* ---------- Cabeçalho do checkout ---------- */
.mdc-header--checkout .mdc-header__brand {
	gap: var(--wp--preset--spacing--20);
}

/* Com logotipo enviado, o nome do site fica só no alt da imagem. */
.mdc-header--checkout .mdc-header__brand:has(.wp-block-site-logo img) .wp-block-site-title {
	display: none;
}

.mdc-header--checkout .wp-block-woocommerce-cart-link a {
	display: inline-flex;
	align-items: center;
	gap: var(--wp--preset--spacing--20);
	min-height: var(--wp--custom--touch-target);
	color: var(--wp--preset--color--contrast);
	font-size: var(--wp--preset--font-size--small);
	text-decoration: none;
}

.mdc-header--checkout .wp-block-woocommerce-cart-link a:is(:hover, :focus-visible) {
	text-decoration: underline;
}

/* ---------- Confirmação do pedido ---------- */
.wp-block-woocommerce-order-confirmation-status {
	font-family: var(--wp--preset--font-family--heading);
}

.wp-block-woocommerce-order-confirmation-summary {
	padding: var(--wp--custom--checkout--panel-padding);
	border: 1px solid var(--wp--custom--checkout--panel-border);
	border-radius: var(--wp--custom--checkout--panel-radius);
	background-color: var(--wp--custom--checkout--panel-background);
}

:is(.wp-block-woocommerce-order-confirmation-totals-wrapper, .wp-block-woocommerce-order-confirmation-downloads-wrapper, .wp-block-woocommerce-order-confirmation-shipping-wrapper, .wp-block-woocommerce-order-confirmation-billing-wrapper, .wp-block-woocommerce-order-confirmation-additional-fields-wrapper) {
	margin-top: var(--wp--custom--checkout--section-gap);
}

:is(.wp-block-woocommerce-order-confirmation-totals, .wp-block-woocommerce-order-confirmation-downloads) :is(th, td) {
	border-color: var(--wp--preset--color--border);
}

/* ---------- Minha Conta ---------- */
/* O WooCommerce limita título e conteúdo da conta a 1000 px, desalinhados do resto do
 * site. Aqui os dois usam a largura ampla do tema (mesma margem do cabeçalho). */
.woocommerce-account .mdc-main > :is(.wp-block-post-title, .wp-block-post-content) {
	max-width: var(--wp--style--global--wide-size);
}

.woocommerce-account .mdc-main > .wp-block-post-title {
	font-size: var(--wp--preset--font-size--xx-large);
}

.woocommerce-account .mdc-main > .wp-block-post-content > .woocommerce {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--wp--preset--spacing--50);
	max-width: none;
	margin-inline: 0;
}

/* Logado: menu da conta e conteúdo. */
@media (min-width: 782px) {
	.woocommerce-account .mdc-main > .wp-block-post-content > .woocommerce:has(> .woocommerce-MyAccount-navigation) {
		grid-template-columns: 15rem minmax(0, 1fr);
		align-items: start;
	}

	.woocommerce-account .woocommerce > .woocommerce-MyAccount-navigation {
		grid-column: 1;
	}

	.woocommerce-account .woocommerce > .woocommerce-MyAccount-content {
		grid-column: 2;
	}
}

/* Avisos ocupam a linha inteira; o contêiner vazio não reserva espaço. */
.woocommerce-account .woocommerce > .woocommerce-notices-wrapper {
	grid-column: 1 / -1;
}

.woocommerce-account .woocommerce > .woocommerce-notices-wrapper:empty {
	display: none;
}

.woocommerce-account .woocommerce > :is(.woocommerce-MyAccount-navigation, .woocommerce-MyAccount-content) {
	float: none;
	width: auto;
}

.woocommerce-MyAccount-navigation ul {
	display: flex;
	flex-direction: column;
	margin: 0;
	padding: 0;
	border: 1px solid var(--wp--custom--checkout--panel-border);
	border-radius: var(--wp--custom--checkout--panel-radius);
	background-color: var(--wp--custom--checkout--panel-background);
	list-style: none;
	overflow: hidden;
}

/* O CSS de tema de blocos do WooCommerce dá padding e borda aos itens; aqui o item é o link. */
.woocommerce-account .woocommerce-MyAccount-navigation ul li {
	margin: 0;
	padding: 0;
	border: 0;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li + li {
	border-top: 1px solid var(--wp--preset--color--border);
}

.woocommerce-MyAccount-navigation a {
	display: flex;
	align-items: center;
	min-height: var(--wp--custom--touch-target);
	padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30);
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.woocommerce-MyAccount-navigation a:is(:hover, :focus-visible) {
	background-color: var(--wp--preset--color--base);
	text-decoration: underline;
}

.woocommerce-MyAccount-navigation .is-active a {
	background-color: var(--wp--preset--color--base);
	box-shadow: inset 3px 0 0 var(--wp--preset--color--primary);
	font-weight: 600;
}

/* Celular: o menu da conta vira uma faixa rolável de opções, sem empurrar o conteúdo. */
@media (max-width: 781px) {
	.woocommerce-MyAccount-navigation ul {
		flex-direction: row;
		overflow-x: auto;
		scrollbar-width: thin;
	}

	.woocommerce-MyAccount-navigation li {
		flex: 0 0 auto;
	}

	.woocommerce-account .woocommerce-MyAccount-navigation ul li + li {
		border-top: 0;
		border-left: 1px solid var(--wp--preset--color--border);
	}

	.woocommerce-MyAccount-navigation .is-active a {
		box-shadow: inset 0 -3px 0 var(--wp--preset--color--primary);
	}
}

/* Login e cadastro lado a lado no desktop, empilhados no celular. */
.woocommerce-account .woocommerce > .u-columns {
	display: grid;
	gap: var(--wp--preset--spacing--50);
	max-width: 60rem;
}

.woocommerce-account .woocommerce :is(h2, h3) {
	margin-top: 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 500;
}

/* Entrar + "Lembrar de mim": lado a lado, alinhados, com a caixa de seleção legível. */
.woocommerce-account form.login .form-row:has(.woocommerce-form-login__rememberme) {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--wp--custom--control--gap) var(--wp--preset--spacing--40);
}

.woocommerce-account form.login .form-row:has(.woocommerce-form-login__rememberme) > * {
	float: none;
	margin: 0;
}

/* O clearfix do WooCommerce (::before/::after) vira item do flex e empurrava a caixa "Lembrar de mim". */
.woocommerce-account form.login .form-row:has(.woocommerce-form-login__rememberme)::before,
.woocommerce-account form.login .form-row:has(.woocommerce-form-login__rememberme)::after {
	display: none;
}

.woocommerce-account input[type="checkbox"] {
	width: 1.25rem;
	height: 1.25rem;
	margin: 0;
	accent-color: var(--wp--preset--color--primary);
}

@media (min-width: 782px) {
	.woocommerce-account .woocommerce > .u-columns {
		grid-template-columns: 1fr 1fr;
	}
}

.woocommerce-account .woocommerce > .u-columns > * {
	float: none;
	width: auto;
}

.woocommerce-account :is(form.login, form.register, form.lost_reset_password, form.woocommerce-EditAccountForm, .woocommerce-address-fields) {
	margin: 0;
	padding: var(--wp--custom--checkout--panel-padding);
	border: 1px solid var(--wp--custom--checkout--panel-border);
	border-radius: var(--wp--custom--checkout--panel-radius);
	background-color: var(--wp--custom--checkout--panel-background);
}

/* Botões da conta: 48 px como todo botão padrão. */
.woocommerce-account .woocommerce :is(.button, button[type="submit"]) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: var(--wp--custom--control--height);
}

/* Lembrar de mim: caixa com área de toque. */
.woocommerce-account .woocommerce-form-login__rememberme {
	display: inline-flex;
	align-items: center;
	gap: var(--wp--preset--spacing--20);
	min-height: var(--wp--custom--touch-target);
}

/* Tabelas (pedidos, downloads): bordas do tema. */
.woocommerce-account .woocommerce table :is(th, td) {
	border-color: var(--wp--preset--color--border);
}

/* Endereços cadastrados. */
.woocommerce-account .woocommerce-Addresses {
	display: grid;
	gap: var(--wp--preset--spacing--40);
}

@media (min-width: 782px) {
	.woocommerce-account .woocommerce-Addresses {
		grid-template-columns: 1fr 1fr;
	}
}

.woocommerce-account .woocommerce-Addresses > * {
	float: none;
	width: auto;
	padding: var(--wp--custom--checkout--panel-padding);
	border: 1px solid var(--wp--custom--checkout--panel-border);
	border-radius: var(--wp--custom--checkout--panel-radius);
}

.woocommerce-account .woocommerce-Addresses::before,
.woocommerce-account .woocommerce-Addresses::after,
.woocommerce-account .u-columns::before,
.woocommerce-account .u-columns::after {
	content: none;
}