/*
	Theme Name: Mac Molduras
	Theme URI:
	Description: Child theme de Hello Elementor para o site Mac Molduras. Contém o código específico do site (conversão de produtos "tela" para variáveis e otimizações de assets), de forma a sobreviver às atualizações do tema pai.
	Author: Mac Molduras
	Author URI:
	Template: hello-elementor
	Version: 1.0.22
	Requires at least: 6.0
	Requires PHP: 7.4
	License: GNU General Public License v3 or later.
	License URI: https://www.gnu.org/licenses/gpl-3.0.html
	Text Domain: hello-elementor-child
*/

/* CSS do site. Preferir os estilos do Elementor; usar este ficheiro só para o que
   não for possível por lá. Carregado por hello_elementor_child_enqueue_styles(). */

/* Rede de segurança: repõe as font-families dos ícones, caso volte a existir uma regra
   global de font-family com `*` (especificidade (0,1,2), que vence `.hm` = (0,1,0)). */

/* Happy Icons (Happy Elementor Addons) — ex.: <i class="hm hm-arrow-right"> */
html body i.hm,
html body span.hm,
html body i.fashm,
html body span.fashm {
	font-family: "Happy Icons" !important;
}

/* Elementor eicons — ex.: <i class="eicon-menu-bar"> */
html body i[class*="eicon-"],
html body span[class*="eicon-"] {
	font-family: "eicons" !important;
}

/* Font Awesome 5 (empacotado pelo Elementor) */
html body i.fa,
html body i.fas,
html body i.fa-solid,
html body span.fas {
	font-family: "Font Awesome 5 Free" !important;
	font-weight: 900 !important;
}

html body i.far,
html body i.fa-regular,
html body span.far {
	font-family: "Font Awesome 5 Free" !important;
	font-weight: 400 !important;
}

html body i.fab,
html body i.fa-brands,
html body span.fab {
	font-family: "Font Awesome 5 Brands" !important;
	font-weight: 400 !important;
}

/* ElementsKit icon pack — ex.: <i class="icon icon-arrow-right"> */
html body i.icon[class*="icon-"],
html body span.icon[class*="icon-"] {
	font-family: "elementskit" !important;
}

/* Loja: altura fixa na imagem (object-fit:contain, não corta) + título e preço de altura
   fixa — é isso que alinha a linha dos botões. Afinar pelas variáveis --mm-*. */

.woocommerce ul.products li.product,
ul.products li.product {
	--mm-img-altura: 200px;   /* altura da caixa da imagem (desktop) */
	--mm-titulo-linhas: 2;    /* nº de linhas do título antes de cortar com "…" */
	--mm-titulo-lh: 1.3;      /* line-height do título */
}

/* Caixa da imagem: altura fixa, produto inteiro visível, sem corte. */
.woocommerce ul.products li.product a.woocommerce-loop-product__link img,
.woocommerce ul.products li.product img.attachment-woocommerce_thumbnail,
ul.products li.product img {
	width: 100% !important;
	height: var(--mm-img-altura) !important;
	max-height: var(--mm-img-altura) !important;
	object-fit: contain !important;
	object-position: center center;
	aspect-ratio: auto !important;
	margin: 0 0 0.7em;
	display: block;
}

/* Título: sempre com a mesma altura, cortado com elipse depois de N linhas. */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
ul.products li.product .woocommerce-loop-product__title {
	display: -webkit-box;
	-webkit-line-clamp: var(--mm-titulo-linhas);
	line-clamp: var(--mm-titulo-linhas);
	-webkit-box-orient: vertical;
	overflow: hidden;
	line-height: var(--mm-titulo-lh) !important;
	/* altura exata de N linhas — garante alinhamento mesmo com títulos de 1 linha */
	height: calc(var(--mm-titulo-linhas) * var(--mm-titulo-lh) * 1em) !important;
	margin: 0 0 0.35em !important;
	padding: 0 !important;
	font-size: 0.95rem;
}

/* Preço: altura fixa de uma linha. */
.woocommerce ul.products li.product .price,
ul.products li.product .price {
	display: block;
	line-height: 1.5 !important;
	height: 1.5em !important;
	margin: 0 0 0.6em !important;
	overflow: hidden;
}

/* O wrapper <a> agrupa imagem + título + preço: mantém-se bloco e sem margens
   extra, para que a sua altura seja exatamente a soma das três partes fixas. */
.woocommerce ul.products li.product a.woocommerce-loop-product__link,
ul.products li.product a.woocommerce-loop-product__link {
	display: block;
	margin-bottom: 0;
}

/* Linha dos botões: ícones do ShopEngine e "Adicionar Carrinho" na mesma base. */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .se-btn,
ul.products li.product .button,
ul.products li.product .se-btn {
	vertical-align: middle;
	margin-top: 0;
}

/* Tablet */
@media (max-width: 1024px) {
	.woocommerce ul.products li.product,
	ul.products li.product {
		--mm-img-altura: 170px;
	}
}


/* Mobile */
@media (max-width: 767px) {
	.woocommerce ul.products li.product,
	ul.products li.product {
		--mm-img-altura: 140px;
		--mm-titulo-linhas: 2;
	}

	.woocommerce ul.products li.product .woocommerce-loop-product__title,
	ul.products li.product .woocommerce-loop-product__title {
		font-size: 0.85rem;
	}
}

/* O site declara "Montserrat" mas nenhuma webfont é carregada (Google Fonts desativadas,
   sem @font-face). Não declarar nenhuma aqui: mudaria o aspeto do site todo. */

/* Páginas legais (ids 3 e 11). Ancorar SEMPRE em .elementor-3/.elementor-11: o cabeçalho
   (.elementor-72) e o rodapé (.elementor-93) repetem as mesmas classes. */

.elementor-3,
.elementor-11 {
	--mm-legal-tinta: #2f2f2f;       /* cor do texto corrido */
	--mm-legal-titulo: #111111;      /* cor dos títulos */
	--mm-legal-suave: #8a8a8a;       /* metadados */
	--mm-legal-acento: #cf0a11;      /* vermelho da marca */
	--mm-legal-linha: #e8e6e4;       /* filetes e bordas */
}

/* --- Largura da página --------------------------------------------------- */

/* Largura original do site (container do Elementor, 1140px): não impor max-width aqui. */

/* Respiro no topo e no fim do CONTEÚDO (nunca do cabeçalho ou do rodapé). */
.elementor-3 > .e-con:first-child,
.elementor-11 > .e-con:first-child {
	--margin-top: clamp(48px, 9vw, 96px) !important;
	--margin-bottom: 0px !important;
}

.elementor-3 > .e-con:last-child,
.elementor-11 > .e-con:last-child {
	--padding-bottom: clamp(56px, 10vw, 112px) !important;
}

/* --- Título da página ---------------------------------------------------- */

/* Estava fixo em 64px, o que transborda em ecrãs pequenos. clamp() escala. */
.elementor-3 .elementor-widget-heading .elementor-heading-title,
.elementor-11 .elementor-widget-heading .elementor-heading-title {
	font-family: "Montserrat", Sans-serif !important;
	font-size: clamp(30px, 5.5vw, 46px) !important;
	font-weight: 700 !important;
	line-height: 1.15 !important;
	color: var(--mm-legal-titulo) !important;
	letter-spacing: -0.01em;
	text-wrap: balance;
	margin: 0 0 0.6em;
	position: relative;
	padding-bottom: 0.42em;
}

/* Filete curto em vermelho: assina o título com a cor da marca. */
.elementor-3 .elementor-widget-heading .elementor-heading-title::after,
.elementor-11 .elementor-widget-heading .elementor-heading-title::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 68px;
	height: 3px;
	background: var(--mm-legal-acento);
}

/* Título repetido num <h1>: escondido visualmente, mas mantido como h1 do documento. */
.elementor-3 .elementor-widget-text-editor .elementor-widget-container > h1:first-of-type {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* --- Corpo do texto ----------------------------------------------------- */

/* O cinza #7A7A7A do kit dá ~4.0:1 sobre branco e falha o WCAG AA (4.5:1).
   Escurecido para cumprir e para tornar a leitura menos cansativa. */
.elementor-3 .elementor-widget-text-editor,
.elementor-11 .elementor-widget-text-editor {
	/* O widget herda a tipografia "text" do kit, que é Roboto (também não carregada).
	   Fixa-se Montserrat, como no resto do site, e 16px, que é a base usada na home. */
	font-family: "Montserrat", Sans-serif !important;
	font-size: 16px;
	color: var(--mm-legal-tinta) !important;
	/* A home usa line-height 24px (1.5). Aqui sobe para 1.7: são páginas de texto
	   corrido longo, onde 1.5 fica apertado para ler parágrafos inteiros. */
	line-height: 1.7;
}

.elementor-3 .elementor-widget-text-editor p,
.elementor-11 .elementor-widget-text-editor p {
	margin: 0 0 1.15em;
	color: inherit;
}

/* Linha "Última atualização: …" como metadado discreto, separada do corpo. */
.elementor-3 .elementor-widget-text-editor .elementor-widget-container > p:first-of-type,
.elementor-11 .elementor-widget-text-editor .elementor-widget-container > p:first-of-type {
	font-size: 13px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--mm-legal-suave);
	border-bottom: 1px solid var(--mm-legal-linha);
	padding-bottom: 1.6em;
	margin-bottom: 2.6em;
}

.elementor-3 .elementor-widget-text-editor .elementor-widget-container > p:first-of-type i,
.elementor-11 .elementor-widget-text-editor .elementor-widget-container > p:first-of-type i {
	font-style: normal;
}

/* --- Títulos de secção -------------------------------------------------- */

/* 14 secções na privacidade: o filete no topo dá ritmo e ajuda a percorrer. */
.elementor-3 .elementor-widget-text-editor h2,
.elementor-11 .elementor-widget-text-editor h2 {
	font-family: "Montserrat", Sans-serif;
	font-size: clamp(18px, 2vw, 22px);
	font-weight: 600;
	line-height: 1.35;
	color: var(--mm-legal-titulo);
	text-wrap: balance;
	margin: 2.9em 0 0.85em;
	padding-top: 1.5em;
	border-top: 1px solid var(--mm-legal-linha);
}

.elementor-3 .elementor-widget-text-editor h2 b,
.elementor-11 .elementor-widget-text-editor h2 b {
	font-weight: inherit;
}

/* O primeiro <h2> segue o metadado, que já tem um filete: evita filete duplo. */
.elementor-3 .elementor-widget-text-editor .elementor-widget-container > p:first-of-type + h2,
.elementor-11 .elementor-widget-text-editor .elementor-widget-container > p:first-of-type + h2 {
	border-top: 0;
	padding-top: 0;
	margin-top: 0;
}

/* --- Listas ------------------------------------------------------------- */

.elementor-3 .elementor-widget-text-editor ul,
.elementor-11 .elementor-widget-text-editor ul {
	margin: 0 0 1.3em;
	padding-left: 1.35em;
	list-style: disc;
}

.elementor-3 .elementor-widget-text-editor li,
.elementor-11 .elementor-widget-text-editor li {
	margin-bottom: 0.55em;
	padding-left: 0.2em;
	line-height: 1.7;
}

/* Marcadores na cor da marca — detalhe pequeno, muda o carácter da página. */
.elementor-3 .elementor-widget-text-editor li::marker,
.elementor-11 .elementor-widget-text-editor li::marker {
	color: var(--mm-legal-acento);
}

/* Destaques a negrito ganham a cor dos títulos, para contrastar com o corpo. */
.elementor-3 .elementor-widget-text-editor b,
.elementor-3 .elementor-widget-text-editor strong,
.elementor-11 .elementor-widget-text-editor b,
.elementor-11 .elementor-widget-text-editor strong {
	color: var(--mm-legal-titulo);
	font-weight: 600;
}

/* --- Ligações ----------------------------------------------------------- */

.elementor-3 .elementor-widget-text-editor a,
.elementor-11 .elementor-widget-text-editor a {
	color: var(--mm-legal-acento);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
	text-decoration-color: rgba(207, 10, 17, 0.35);
	transition: text-decoration-color 0.15s ease, color 0.15s ease;
	overflow-wrap: break-word; /* e-mails e URLs longos não transbordam */
}

.elementor-3 .elementor-widget-text-editor a:hover,
.elementor-11 .elementor-widget-text-editor a:hover {
	text-decoration-color: var(--mm-legal-acento);
}

.elementor-3 .elementor-widget-text-editor a:focus-visible,
.elementor-11 .elementor-widget-text-editor a:focus-visible {
	outline: 2px solid var(--mm-legal-acento);
	outline-offset: 3px;
	border-radius: 2px;
}

/* --- Tabelas (cookies / prazos) ----------------------------------------- */

.elementor-3 .elementor-widget-text-editor table,
.elementor-11 .elementor-widget-text-editor table {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 2em;
	font-size: 15px;
}

.elementor-3 .elementor-widget-text-editor th,
.elementor-11 .elementor-widget-text-editor th {
	background: #faf9f8;
	color: var(--mm-legal-titulo);
	font-weight: 600;
	font-size: 12px;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	text-align: left;
	padding: 12px 14px;
	border-bottom: 2px solid var(--mm-legal-linha);
	white-space: nowrap;
}

.elementor-3 .elementor-widget-text-editor td,
.elementor-11 .elementor-widget-text-editor td {
	padding: 12px 14px;
	border-bottom: 1px solid var(--mm-legal-linha);
	vertical-align: top;
	line-height: 1.6;
}

.elementor-3 .elementor-widget-text-editor tbody tr:nth-child(even) td,
.elementor-11 .elementor-widget-text-editor tbody tr:nth-child(even) td {
	background: #fcfbfb;
}

/* --- Mobile ------------------------------------------------------------- */

@media (max-width: 767px) {
	.elementor-3 .elementor-widget-text-editor h2,
	.elementor-11 .elementor-widget-text-editor h2 {
		margin-top: 2.2em;
		padding-top: 1.2em;
	}

	.elementor-3 .elementor-widget-text-editor ul,
	.elementor-11 .elementor-widget-text-editor ul {
		padding-left: 1.1em;
	}

	/* Sem wrapper no markup: rola o próprio <table>. Só em mobile; em desktop fica display:table. */
	.elementor-3 .elementor-widget-text-editor table,
	.elementor-11 .elementor-widget-text-editor table {
		display: block;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
}

/* --- Impressão ---------------------------------------------------------- */

/* Só o conteúdo. O cabeçalho e o rodapé não são tocados, nem aqui. */
@media print {
	.elementor-3 .elementor-widget-text-editor,
	.elementor-11 .elementor-widget-text-editor {
		color: #000 !important;
		font-size: 11pt;
	}

	.elementor-3 .elementor-widget-text-editor h2,
	.elementor-11 .elementor-widget-text-editor h2 {
		break-after: avoid;
		page-break-after: avoid;
	}

	.elementor-3 .elementor-widget-text-editor a,
	.elementor-11 .elementor-widget-text-editor a {
		color: #000 !important;
	}

	.elementor-3 .elementor-widget-text-editor table,
	.elementor-11 .elementor-widget-text-editor table {
		display: table;
		overflow: visible;
	}
}

/* Contactos: rótulo, número e nota são nós de texto separados por <br>, sem spans — daí
   ::first-line. Se o número quebrar em duas linhas, a sobra fica com o estilo da nota. */

.mac-contacts-info {
	--mac-num-cor: #1a1a1a;    /* número + rótulo */
	--mac-nota-cor: #8a8a8a;   /* nota do custo da chamada */
}

/* Estilo base do parágrafo = o da NOTA (segunda linha). */
.mac-contacts-info .elementor-widget-container > p {
	margin: 0 0 1.15em;
	font-size: 12px;
	line-height: 1.5;
	color: var(--mac-nota-cor);
	/* Dígitos de largura fixa: os dois números alinham na vertical. */
	font-variant-numeric: tabular-nums;
}

.mac-contacts-info .elementor-widget-container > p:last-child {
	margin-bottom: 0;
}

/* Primeira linha = "Telefone: (+ 351) 239 838 794" — a informação que importa. */
.mac-contacts-info .elementor-widget-container > p::first-line {
	font-size: 16px;
	font-weight: 600;
	line-height: 1.45;
	color: var(--mac-num-cor);
	letter-spacing: 0;
}

@media (max-width: 767px) {
	/* Menos 1px reduz o risco de o número passar a duas linhas em ecrã estreito. */
	.mac-contacts-info .elementor-widget-container > p::first-line {
		font-size: 15px;
	}
}

/* Carrinho à largura do checkout: o checkout usa o template Default (tem .site-main, que o
   tema limita); o carrinho é Full Width e não tem wrapper. Escada copiada do theme.min.css. */

body.page-id-8 .wp-block-woocommerce-cart {
	width: 100%;
	margin-inline-start: auto;
	margin-inline-end: auto;
}

@media (max-width: 575px) {
	body.page-id-8 .wp-block-woocommerce-cart {
		padding-inline-start: 10px;
		padding-inline-end: 10px;
	}
}

@media (min-width: 576px) {
	body.page-id-8 .wp-block-woocommerce-cart {
		max-width: 500px;
	}
}

@media (min-width: 768px) {
	body.page-id-8 .wp-block-woocommerce-cart {
		max-width: 600px;
	}
}

@media (min-width: 992px) {
	body.page-id-8 .wp-block-woocommerce-cart {
		max-width: 800px;
	}
}

@media (min-width: 1200px) {
	body.page-id-8 .wp-block-woocommerce-cart {
		max-width: 1140px;
	}
}

/* Flyout mobile (HFE): faltava padding vertical nos itens (o widget só define o lateral) e o
   botão de fechar vinha a 23px. O padding lateral dos links mantém-se, vem do Elementor. */

/* Painel: espaço no topo para o botão de fechar não colidir com o 1.º item. */
.hfe-flyout-wrapper .hfe-flyout-content {
	padding-top: 64px;
	padding-bottom: 32px;
}

.hfe-flyout-wrapper .hfe-flyout-content .hfe-nav-menu {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Separadores a atravessar o painel, como num menu de app. */
.hfe-flyout-wrapper .hfe-flyout-content .hfe-nav-menu > li.menu-item {
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.hfe-flyout-wrapper .hfe-flyout-content .hfe-nav-menu > li.menu-item:last-child {
	border-bottom: 0;
}

/* Links: altura de toque confortável e o padding vertical que faltava.
   O padding lateral vem das definições do widget e não é alterado. */
.hfe-flyout-wrapper .hfe-flyout-content .hfe-nav-menu > li.menu-item > a.hfe-menu-item {
	display: flex;
	align-items: center;
	min-height: 52px;
	padding-top: 14px;
	padding-bottom: 14px;
	font-family: "Montserrat", Sans-serif;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.35;
	/* a cor vem das definições do widget — não é imposta aqui */
}

/* Item ativo: marca discreta na cor da marca, à esquerda. */
.hfe-flyout-wrapper .hfe-flyout-content .hfe-nav-menu > li.current-menu-item > a.hfe-menu-item {
	box-shadow: inset 3px 0 0 0 #cf0a11;
}

/* Botão "Login": é o último item com a classe .elementor-button (o HFE trata-o
   como CTA). Precisa de recuo próprio para a pílula não encostar às margens. */
.hfe-flyout-wrapper .hfe-flyout-content .hfe-nav-menu > li.menu-item > a.hfe-menu-item.elementor-button {
	justify-content: center;
	min-height: 48px;
	margin: 22px 23px 0;
	padding-top: 13px;
	padding-bottom: 13px;
	text-align: center;
}

/* A linha que contém a pílula não leva separador. */
.hfe-flyout-wrapper .hfe-flyout-content .hfe-nav-menu > li.menu-item:has(> a.hfe-menu-item.elementor-button) {
	border-bottom: 0;
}

/* Área clicável a 44px com o ícone a 22px; o HFE põe position:absolute também no <svg>. */
.hfe-flyout-wrapper .hfe-flyout-close {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	line-height: 1;
	margin: 6px;
}

.hfe-flyout-wrapper .hfe-flyout-close svg {
	position: static;
	width: 22px;
	height: 22px;
	margin: 0;
}

/* Carrinho/Checkout: blocos WooCommerce hidratados no cliente — as classes wc-block-components-*
   vieram do CSS do WooCommerce, não se confirmam por curl. Alinhamento de marca, não layout. */

.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout {
	--mm-wc-acento: #cf0a11;
	--mm-wc-acento-hover: rgba(207, 10, 17, 0.64); /* = #CF0A11A3 do site */
	--mm-wc-titulo: #1a1a1a;
	--mm-wc-texto: #2f2f2f;
	--mm-wc-suave: #7a7a7a;
	--mm-wc-linha: #e2e0de;
	--mm-wc-raio-botao: 41px; /* pílula, igual ao botão Login do site */
}

/* --- Tipografia base ---------------------------------------------------- */

body .wp-block-woocommerce-cart,
body .wp-block-woocommerce-checkout {
	font-family: "Montserrat", Sans-serif;
	color: var(--mm-wc-texto);
}

/* --- Títulos ------------------------------------------------------------ */

body .wp-block-woocommerce-cart .wc-block-cart__totals-title,
body .wp-block-woocommerce-cart .wc-block-components-title,
body .wp-block-woocommerce-checkout .wc-block-components-checkout-step__title,
body .wp-block-woocommerce-checkout .wc-block-components-title {
	font-family: "Montserrat", Sans-serif;
	font-weight: 600;
	color: var(--mm-wc-titulo);
	letter-spacing: 0;
}

body .wp-block-woocommerce-cart .wc-block-cart__empty-cart__title {
	font-family: "Montserrat", Sans-serif;
	font-weight: 700;
	color: var(--mm-wc-titulo);
}

body .wp-block-woocommerce-checkout .wc-block-components-checkout-step__description {
	color: var(--mm-wc-suave);
}

/* --- Botões principais -------------------------------------------------- */

/* "Finalizar compra" (carrinho) e "Fazer encomenda" (checkout).
   `:not(.is-link)` evita transformar botões-texto em pílulas. */
body .wp-block-woocommerce-cart .wc-block-cart__submit-button:not(.is-link),
body .wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button:not(.is-link) {
	background-color: var(--mm-wc-acento);
	border: 0;
	border-radius: var(--mm-wc-raio-botao);
	color: #fff;
	font-family: "Montserrat", Sans-serif;
	font-size: 16px;
	font-weight: 600;
	min-height: 52px;
	padding: 14px 28px;
	transition: background-color 0.15s ease;
}

body .wp-block-woocommerce-cart .wc-block-cart__submit-button:not(.is-link):hover,
body .wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button:not(.is-link):hover {
	background-color: var(--mm-wc-acento-hover);
	color: #fff;
}

/* O foco dos blocos vem em azul (#0675c4). Passa para a cor da marca. */
body .wp-block-woocommerce-cart .wc-block-components-button:not(.is-link):focus,
body .wp-block-woocommerce-checkout .wc-block-components-button:not(.is-link):focus {
	box-shadow: inset 0 0 0 1px #fff, 0 0 0 2px var(--mm-wc-acento);
	outline: 3px solid transparent;
}

/* --- Botão secundário: aplicar cupão ------------------------------------ */

/* Contornado em vez de cheio, para não competir com o botão principal. */
body .wp-block-woocommerce-cart .wc-block-components-totals-coupon__button:not(.is-link),
body .wp-block-woocommerce-checkout .wc-block-components-totals-coupon__button:not(.is-link) {
	background-color: transparent;
	border: 1.5px solid var(--mm-wc-acento);
	border-radius: var(--mm-wc-raio-botao);
	color: var(--mm-wc-acento);
	font-family: "Montserrat", Sans-serif;
	font-weight: 600;
	min-height: 44px;
	padding: 10px 22px;
	transition: background-color 0.15s ease, color 0.15s ease;
}

body .wp-block-woocommerce-cart .wc-block-components-totals-coupon__button:not(.is-link):hover,
body .wp-block-woocommerce-checkout .wc-block-components-totals-coupon__button:not(.is-link):hover {
	background-color: var(--mm-wc-acento);
	color: #fff;
}

/* --- Campos de formulário ----------------------------------------------- */

/* A borda dos blocos está no <input>, não no wrapper. */
body .wp-block-woocommerce-checkout .wc-block-components-text-input input,
body .wp-block-woocommerce-checkout .wc-block-components-textarea,
body .wp-block-woocommerce-cart .wc-block-components-totals-coupon__input input {
	border: 1px solid #d9d9d9;
	border-radius: 6px;
	background-color: #fff;
	font-family: "Montserrat", Sans-serif;
	font-size: 16px; /* 16px evita o zoom automático do iOS ao focar */
	color: var(--mm-wc-texto);
}

body .wp-block-woocommerce-checkout .wc-block-components-text-input input:focus,
body .wp-block-woocommerce-checkout .wc-block-components-textarea:focus,
body .wp-block-woocommerce-cart .wc-block-components-totals-coupon__input input:focus {
	border: 1.5px solid var(--mm-wc-acento);
	box-shadow: 0 0 0 3px rgba(207, 10, 17, 0.12);
	outline: 0;
}

/* --- Nome e preço do produto -------------------------------------------- */

body .wp-block-woocommerce-cart .wc-block-components-product-name,
body .wp-block-woocommerce-checkout .wc-block-components-product-name {
	font-family: "Montserrat", Sans-serif;
	font-weight: 600;
	color: var(--mm-wc-titulo);
	text-decoration: none;
}

body .wp-block-woocommerce-cart a.wc-block-components-product-name:hover,
body .wp-block-woocommerce-checkout a.wc-block-components-product-name:hover {
	color: var(--mm-wc-acento);
}

body .wp-block-woocommerce-cart .wc-block-components-product-price,
body .wp-block-woocommerce-checkout .wc-block-components-product-price {
	font-family: "Montserrat", Sans-serif;
	color: var(--mm-wc-texto);
	font-variant-numeric: tabular-nums;
}

body .wp-block-woocommerce-cart .wc-block-components-product-metadata {
	color: var(--mm-wc-suave);
}

/* --- Totais ------------------------------------------------------------- */

body .wp-block-woocommerce-cart .wc-block-components-totals-item__label,
body .wp-block-woocommerce-checkout .wc-block-components-totals-item__label {
	color: var(--mm-wc-suave);
}

body .wp-block-woocommerce-cart .wc-block-components-totals-item__value,
body .wp-block-woocommerce-checkout .wc-block-components-totals-item__value {
	color: var(--mm-wc-titulo);
	font-variant-numeric: tabular-nums;
}

/* Total final: é o número que o cliente procura. */
body .wp-block-woocommerce-cart .wc-block-components-totals-footer-item,
body .wp-block-woocommerce-checkout .wc-block-components-totals-footer-item {
	border-top: 1px solid var(--mm-wc-linha);
	font-family: "Montserrat", Sans-serif;
	font-weight: 700;
	color: var(--mm-wc-titulo);
}

body .wp-block-woocommerce-cart .wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
body .wp-block-woocommerce-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
	color: var(--mm-wc-titulo);
	font-weight: 700;
}

/* --- Ligações e ações --------------------------------------------------- */

body .wp-block-woocommerce-cart .wc-block-cart-item__remove-link,
body .wp-block-woocommerce-cart .wc-block-components-button.is-link,
body .wp-block-woocommerce-checkout .wc-block-components-button.is-link {
	color: var(--mm-wc-acento);
	text-underline-offset: 0.18em;
}

body .wp-block-woocommerce-cart .wc-block-cart-item__remove-link:hover,
body .wp-block-woocommerce-cart .wc-block-components-button.is-link:hover,
body .wp-block-woocommerce-checkout .wc-block-components-button.is-link:hover {
	color: var(--mm-wc-acento-hover);
}

/* --- Seletor de quantidade ---------------------------------------------- */

body .wp-block-woocommerce-cart .wc-block-components-quantity-selector {
	border: 1px solid #d9d9d9;
	border-radius: 6px;
}

body .wp-block-woocommerce-cart .wc-block-components-quantity-selector__input {
	font-family: "Montserrat", Sans-serif;
	color: var(--mm-wc-titulo);
	font-variant-numeric: tabular-nums;
}

body .wp-block-woocommerce-cart .wc-block-components-quantity-selector__button:hover {
	color: var(--mm-wc-acento);
}

/* --- Mobile ------------------------------------------------------------- */

@media (max-width: 575px) {
	/* Botão principal a toda a largura: é a ação da página. */
	body .wp-block-woocommerce-cart .wc-block-cart__submit-button:not(.is-link),
	body .wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button:not(.is-link) {
		width: 100%;
	}
}

/* Carrinho vazio: o <li> da grelha já é flex column (CSS do WooCommerce), basta margin-top:auto
   no botão. O ícone é um ::before do título com currentColor — troca-se a cor do ::before. */

/* --- Mensagem de carrinho vazio ----------------------------------------- */

body .wp-block-woocommerce-cart .wc-block-cart__empty-cart__title {
	text-align: center;
	font-family: "Montserrat", Sans-serif;
	font-size: clamp(19px, 2.8vw, 24px);
	font-weight: 700;
	line-height: 1.3;
	color: var(--mm-wc-titulo);
	margin: 8px 0 20px;
}

/* Ícone menor e em cinza: troca-se a cor do ::before, não a do título (o texto ia atrás). */
body .wp-block-woocommerce-cart .wc-block-cart__empty-cart__title.with-empty-cart-icon::before {
	background-color: #d5d2cf;
	width: 3.6em;
	height: 3.6em;
	mask-size: 3.6em;
	-webkit-mask-size: 3.6em;
	margin-bottom: 1.1em;
}

/* "Explore a loja" é a única ação desta página: passa a botão, não a link. */
body .wp-block-woocommerce-empty-cart-block > p a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 13px 30px;
	background-color: var(--mm-wc-acento);
	border-radius: var(--mm-wc-raio-botao);
	color: #fff;
	font-family: "Montserrat", Sans-serif;
	font-size: 16px;
	font-weight: 600;
	text-decoration: none;
	transition: background-color 0.15s ease;
}

body .wp-block-woocommerce-empty-cart-block > p a:hover {
	background-color: var(--mm-wc-acento-hover);
	color: #fff;
}

/* Separador de pontos: mantém-se o estilo escolhido, mas discreto e com ar. */
body .wp-block-woocommerce-empty-cart-block hr.wp-block-separator {
	margin-top: 44px;
	margin-bottom: 40px;
	border: 0;
	color: #d5d2cf;
}

/* --- Título "Novo na loja" ---------------------------------------------- */

body .wp-block-woocommerce-empty-cart-block > h2.wp-block-heading {
	font-family: "Montserrat", Sans-serif;
	font-size: clamp(20px, 2.6vw, 28px);
	font-weight: 700;
	line-height: 1.25;
	color: var(--mm-wc-titulo);
	margin: 0 0 26px;
}

/* --- Grelha de produtos ------------------------------------------------- */

/* Caixa de imagem com altura fixa: cartões parelhos, produto nunca cortado. */
body .wp-block-woocommerce-empty-cart-block .wc-block-grid__product-image img {
	width: 100%;
	height: 190px;
	object-fit: contain;
	object-position: center;
	margin: 0 auto 0.7em;
	display: block;
}

/* Título com altura de 2 linhas exatas, cortado com elipse. */
body .wp-block-woocommerce-empty-cart-block .wc-block-grid__product-title {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	height: calc(2 * 1.35em);
	line-height: 1.35;
	font-family: "Montserrat", Sans-serif;
	font-size: 14px;
	font-weight: 600;
	color: var(--mm-wc-titulo);
	margin: 0 0 0.45em;
}

body .wp-block-woocommerce-empty-cart-block a.wc-block-grid__product-link:hover .wc-block-grid__product-title {
	color: var(--mm-wc-acento);
}

body .wp-block-woocommerce-empty-cart-block .wc-block-grid__product-price {
	font-family: "Montserrat", Sans-serif;
	font-size: 15px;
	font-weight: 600;
	color: var(--mm-wc-titulo);
	font-variant-numeric: tabular-nums;
	margin: 0 0 0.9em;
}

/* O <li> já é flex column (CSS do WooCommerce): isto encosta o botão à base,
   e é o que alinha os botões todos na mesma linha. */
body .wp-block-woocommerce-empty-cart-block .wc-block-grid__product-add-to-cart {
	margin-top: auto;
}

body .wp-block-woocommerce-empty-cart-block .wc-block-grid__product-add-to-cart .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 11px 22px;
	background-color: var(--mm-wc-acento);
	border: 0;
	border-radius: var(--mm-wc-raio-botao);
	color: #fff;
	font-family: "Montserrat", Sans-serif;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	transition: background-color 0.15s ease;
}

body .wp-block-woocommerce-empty-cart-block .wc-block-grid__product-add-to-cart .wp-block-button__link:hover {
	background-color: var(--mm-wc-acento-hover);
	color: #fff;
}

@media (max-width: 767px) {
	body .wp-block-woocommerce-empty-cart-block .wc-block-grid__product-image img {
		height: 140px;
	}
}

/* Notices do WooCommerce (clássicas, não as de blocos). O ícone é um ::before com a fonte
   WooCommerce; o ::after é um clearfix que em flex viria como item — daí ser anulado. */

body .woocommerce-message,
body .woocommerce-info,
body .woocommerce-error {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px 20px;
	margin: 0 0 28px;
	padding: 18px 22px 18px 54px;
	border: 1px solid #e8e6e4;
	border-top-width: 3px;
	border-radius: 8px;
	background-color: #fbfbfa;
	color: #2f2f2f;
	font-family: "Montserrat", Sans-serif;
	font-size: 15px;
	line-height: 1.5;
}

body .woocommerce-message::after,
body .woocommerce-info::after,
body .woocommerce-error::after {
	display: none;
}

/* Ícone centrado na vertical, em vez do `top: 1em` do WooCommerce. */
body .woocommerce-message::before,
body .woocommerce-info::before,
body .woocommerce-error::before {
	top: 50%;
	left: 20px;
	transform: translateY(-50%);
	font-size: 18px;
	line-height: 1;
}

/* Verde e vermelho mantêm-se: são semânticos. O info vinha em roxo (#720eec), fora da
   paleta do site, e passa a neutro. */
body .woocommerce-info {
	border-top-color: #8a8a8a;
}

body .woocommerce-info::before {
	color: #8a8a8a;
}

/* Botão da notice: pílula contornada neutra, que fica vermelha no hover. Vermelho de base
   dentro de uma caixa verde de sucesso criava um choque de cores. */
body .woocommerce-message a.button,
body .woocommerce-info a.button,
body .woocommerce-error a.button {
	float: none;
	margin-left: auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding: 10px 22px;
	border: 1.5px solid #1a1a1a;
	border-radius: 41px;
	background-color: transparent;
	color: #1a1a1a;
	font-family: "Montserrat", Sans-serif;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

body .woocommerce-message a.button:hover,
body .woocommerce-info a.button:hover,
body .woocommerce-error a.button:hover {
	border-color: #cf0a11;
	background-color: #cf0a11;
	color: #fff;
}

@media (max-width: 575px) {
	body .woocommerce-message a.button,
	body .woocommerce-info a.button,
	body .woocommerce-error a.button {
		width: 100%;
		margin-left: 0;
	}
}

/* Encomenda recebida / detalhes da encomenda (template clássico do WooCommerce, não blocos).
   Âmbito em .woocommerce-order, que envolve o resumo, a tabela e os endereços. */

body .woocommerce .woocommerce-order .woocommerce-notice--success,
body .woocommerce .woocommerce-order .woocommerce-thankyou-order-received {
	font-family: "Montserrat", Sans-serif;
	font-size: 16px;
	color: #2f2f2f;
	margin: 0 0 1.6em;
}

/* O WooCommerce zera a margem do <ul> mas não o padding-left do browser: é isso que
   desalinhava a faixa do resumo em relação ao texto acima. */
body .woocommerce .woocommerce-order ul.order_details {
	display: flex;
	flex-wrap: wrap;
	margin: 0 0 2.6em;
	padding: 0;
	border: 1px solid #e8e6e4;
	border-radius: 8px;
	overflow: hidden;
	list-style: none;
}

/* Anula o clearfix: em flex viria como item fantasma. */
body .woocommerce .woocommerce-order ul.order_details::before,
body .woocommerce .woocommerce-order ul.order_details::after {
	display: none;
}

body .woocommerce .woocommerce-order ul.order_details li {
	float: none;
	flex: 1 1 auto;
	margin: 0;
	padding: 14px 22px;
	border-right: 1px solid #e8e6e4;
	font-family: "Montserrat", Sans-serif;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.07em;
	line-height: 1.4;
	text-transform: uppercase;
	color: #8a8a8a;
}

body .woocommerce .woocommerce-order ul.order_details li:last-of-type {
	border-right: 0;
}

body .woocommerce .woocommerce-order ul.order_details li strong {
	display: block;
	margin-top: 5px;
	font-size: 17px;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: 0;
	text-transform: none;
	color: #1a1a1a;
	font-variant-numeric: tabular-nums;
}

/* --- Títulos de secção --- */

body .woocommerce .woocommerce-order .woocommerce-order-details__title,
body .woocommerce .woocommerce-order .woocommerce-column__title,
body .woocommerce .woocommerce-order .woocommerce-order-details > h2,
body .woocommerce .woocommerce-order .woocommerce-customer-details > h2 {
	font-family: "Montserrat", Sans-serif;
	font-size: clamp(19px, 2.3vw, 25px);
	font-weight: 700;
	line-height: 1.25;
	color: #1a1a1a;
	margin: 0 0 0.8em;
}

/* --- Tabela --- */

/* A borda base usa `color-mix(currentColor 20%)`, que varia com a cor do texto.
   Aqui fixa-se o filete da casa. */
body .woocommerce .woocommerce-order table.shop_table {
	width: 100%;
	margin: 0 0 2.5em;
	border: 1px solid #e8e6e4;
	border-radius: 8px;
	border-collapse: separate;
	border-spacing: 0;
	overflow: hidden;
	font-family: "Montserrat", Sans-serif;
	font-size: 15px;
	color: #2f2f2f;
}

body .woocommerce .woocommerce-order table.shop_table thead th {
	padding: 13px 18px;
	background-color: #faf9f8;
	border-bottom: 1px solid #e8e6e4;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: #1a1a1a;
}

body .woocommerce .woocommerce-order table.shop_table td,
body .woocommerce .woocommerce-order table.shop_table tbody th,
body .woocommerce .woocommerce-order table.shop_table tfoot th,
body .woocommerce .woocommerce-order table.shop_table tfoot td {
	padding: 14px 18px;
	border-top: 1px solid #e8e6e4;
	vertical-align: top;
	line-height: 1.6;
}

/* Sem filete duplo por baixo do cabeçalho. */
body .woocommerce .woocommerce-order table.shop_table tbody tr:first-child td,
body .woocommerce .woocommerce-order table.shop_table tbody tr:first-child th {
	border-top: 0;
}

/* Valores à direita e com dígitos de largura fixa: as quantias alinham em coluna. */
body .woocommerce .woocommerce-order table.shop_table td.product-total,
body .woocommerce .woocommerce-order table.shop_table th.product-total,
body .woocommerce .woocommerce-order table.shop_table td.woocommerce-table__product-total,
body .woocommerce .woocommerce-order table.shop_table tfoot td {
	text-align: right;
	font-variant-numeric: tabular-nums;
}

body .woocommerce .woocommerce-order table.shop_table tfoot th {
	font-weight: 600;
	color: #1a1a1a;
}

/* Destaque do Total. As linhas do tfoot não têm classe, mas só as dos totais têm
   th[scope="row"] — "Nota:" e "Acções:" não. O Total é a última dessas. */
body .woocommerce .woocommerce-order table.shop_table tfoot tr:has(> th[scope="row"]):has(+ tr > th:not([scope="row"])) > th,
body .woocommerce .woocommerce-order table.shop_table tfoot tr:has(> th[scope="row"]):has(+ tr > th:not([scope="row"])) > td,
body .woocommerce .woocommerce-order table.shop_table tfoot tr:last-child:has(> th[scope="row"]) > th,
body .woocommerce .woocommerce-order table.shop_table tfoot tr:last-child:has(> th[scope="row"]) > td {
	font-size: 17px;
	font-weight: 700;
	color: #1a1a1a;
	background-color: #faf9f8;
}

body .woocommerce .woocommerce-order table.shop_table td.product-name a {
	color: #1a1a1a;
	font-weight: 600;
	text-decoration: none;
}

body .woocommerce .woocommerce-order table.shop_table td.product-name a:hover {
	color: #cf0a11;
}

body .woocommerce .woocommerce-order table.shop_table td small {
	color: #8a8a8a;
}

/* --- Endereços --- */

/* O WooCommerce dá 2px em baixo e à direita e 1px nos outros lados; fica assimétrico. */
body .woocommerce .woocommerce-order .woocommerce-customer-details address {
	padding: 18px 20px;
	border: 1px solid #e8e6e4;
	border-bottom-width: 1px;
	border-right-width: 1px;
	border-radius: 8px;
	font-family: "Montserrat", Sans-serif;
	font-size: 15px;
	line-height: 1.7;
	color: #2f2f2f;
}

/* --- Botões (ex.: "Factura") --- */

body .woocommerce .woocommerce-order a.button,
body .woocommerce .woocommerce-order .button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	padding: 9px 20px;
	border: 1.5px solid #1a1a1a;
	border-radius: 41px;
	background-color: transparent;
	color: #1a1a1a;
	font-family: "Montserrat", Sans-serif;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

body .woocommerce .woocommerce-order a.button:hover,
body .woocommerce .woocommerce-order .button:hover {
	border-color: #cf0a11;
	background-color: #cf0a11;
	color: #fff;
}

@media (max-width: 767px) {
	/* A faixa do resumo passa a lista vertical: 4 colunas não cabem num telefone. */
	body .woocommerce .woocommerce-order ul.order_details li {
		flex: 1 1 100%;
		border-right: 0;
		border-bottom: 1px solid #e8e6e4;
	}

	body .woocommerce .woocommerce-order ul.order_details li:last-of-type {
		border-bottom: 0;
	}

	body .woocommerce .woocommerce-order table.shop_table td,
	body .woocommerce .woocommerce-order table.shop_table tbody th,
	body .woocommerce .woocommerce-order table.shop_table tfoot th,
	body .woocommerce .woocommerce-order table.shop_table tfoot td {
		padding: 12px 14px;
	}
}



/* Nota dos portes grátis: parágrafo acrescentado no editor logo após o bloco da
   linha de envio, no resumo. O seletor de irmão adjacente dispensa classe própria. */

/* Atenção ao prefixo: o carrinho usa `cart-order-summary-shipping-block` e o checkout
   usa `checkout-order-summary-shipping-block`. São classes diferentes, não uma só. */
body .wp-block-woocommerce-cart-order-summary-shipping-block + p,
body .wp-block-woocommerce-checkout-order-summary-shipping-block + p {
	margin: -6px 0 14px;
	font-family: "Montserrat", Sans-serif;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.45;
	letter-spacing: 0.01em;
	color: #cf0a11;
}

/* Só no checkout: lá o CSS do WooCommerce dá 16px de padding lateral às linhas de
   totais (no carrinho dá 0), e sem eles o parágrafo fica 16px mais à esquerda. */
body .wp-block-woocommerce-checkout-order-summary-shipping-block + p {
	padding-left: 16px;
	padding-right: 16px;
}

/* Item-botão do menu (ex.: "Área do Cliente"): texto sempre branco. O widget dá branco
   ao botão e vermelho ao current-menu-item, com igual especificidade — e o 2.º vem depois. */

a.hfe-menu-item.elementor-button,
a.hfe-menu-item.elementor-button:hover,
a.hfe-menu-item.elementor-button:focus,
a.hfe-menu-item.elementor-button:active {
	color: #fff !important;
}

/* Item-botão não leva o ponteiro do menu (a linha vermelha do ::after). Aqui o
   !important é deliberado: a regra do widget tem 8 classes e vencê-la exigia 9. */

li.hfe-button-wrapper > a.hfe-menu-item.elementor-button::before,
li.hfe-button-wrapper > a.hfe-menu-item.elementor-button::after {
	display: none !important;
}