/*
 * Comportamento do cabeçalho e do rodapé do Elementor (inc/cabecalho.php, assets/js/cabecalho.js).
 * Cores, fontes, tamanhos e espaços ficam no Elementor; aqui só o que ele não faz.
 */
/* ---------- Cabeçalho grudado: a barra de avisos sai da tela e o menu fica ---------- */
.elementor-location-header { --dd-barra-altura: 44px; position: sticky; top: calc(-1 * var(--dd-barra-altura)); z-index: 90; }
.admin-bar .elementor-location-header { top: calc(32px - var(--dd-barra-altura)); }
@media (max-width: 782px) {
	.admin-bar .elementor-location-header { top: calc(46px - var(--dd-barra-altura)); }
}
.dd-cabecalho-fixo.is-escondido { transform: translateY(-100%); }
/* ---------- Barra de avisos ---------- */
.dd-barra { height: var(--dd-barra-altura, 44px); overflow: hidden; }
.dd-barra-texto p { margin: 0; }
.dd-barra-texto strong { color: #C9B79C; font-weight: 600; }
/* rosa claro: contraste 9,6 sobre o ameixa */
/* Lista rolando (classe dd-barra-lista), a barra em uso. */
/* Uma linha só desde o primeiro quadro (sem esperar o JS): a barra não muda de altura e a página não pula. */
.dd-barra-lista .elementor-icon-list-items { flex-wrap: nowrap !important; width: max-content; }
.dd-barra-lista .elementor-icon-list-items.dd-rolando { animation: dd-rolar 45s linear infinite; }
.dd-barra:hover .dd-rolando { animation-play-state: paused; }
.dd-barra-lista .elementor-icon-list-item { white-space: nowrap; margin: 0 !important; padding: 0 !important; }
/* Barra marrom (dono, 02/10/2026): um traço caramelo separa os avisos, com 48px de cada lado; ícones e frases em caramelo claro. */
/* Fio fino champanhe entre os avisos (o fio de 40px x 1px do moodboard, em versão curta). */
.dd-barra-lista .elementor-icon-list-item::before { content: ""; flex: none; width: 24px; height: 1px; margin-inline: 44px; border-radius: 0; background: #C9B79C; opacity: .7; }
.dd-barra-lista .elementor-icon-list-icon { color: #C9B79C; }
.dd-barra-lista .elementor-icon-list-item::after { display: none !important; }
.dd-barra-lista strong { font-weight: 500; color: #FFFFFF; }
/* Frase de marca: champanhe (contraste 9,6 sobre o preto Ginga), Jost fina maiúscula espaçada com o símbolo da Mandala no meio ( <span class="dd-marca">Texto <img …> texto</span> ). */
.dd-barra-lista .dd-marca {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: var(--gd-fonte);
	/* Cormorant Garamond fica só nos títulos;
	a barra usa a fonte de texto */
	font-size: 12px;
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0.2em;
	text-transform: uppercase; /* maiúsculas espaçadas na barra (dono gostou assim, 02/10/2026) */
	color: #C9B79C;
}
.dd-barra-lista .dd-marca img { width: auto; height: 15px; margin-inline: 4px; }
@keyframes dd-rolar { to { transform: translateX(-50%); } }
/* ---------- Cabeçalho "em ilha": cápsula branca sobre o blush (docs/marca/cabecalho-menu.html, opção A) ---------- */
/* Ícones em círculos blush (☰, conta, busca, sacola), 40px */
.dd-cabecalho :is(.dd-circulo .elementor-icon, .dd-icone-botao) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--pc-blush);
	transition: background-color 0.2s;
}
.dd-cabecalho :is(.dd-circulo .elementor-icon, .dd-icone-botao):hover { background: #E5DED4; }
.dd-cabecalho .dd-circulo .elementor-icon :is(svg, i) { width: 18px; height: 18px; font-size: 18px; }
.dd-cabecalho .dd-icone-busca, .dd-cabecalho .dd-icone-carrinho { width: 20px; height: 20px; }
.dd-cabecalho .dd-carrinho-qtd { top: 0; right: -3px; bottom: auto; min-width: 18px; height: 18px; font: 600 11px/18px var(--gd-fonte); }
.dd-cabecalho :is(.dd-circulo a, .dd-icone-botao)::after { inset: -2px; }
/* os 40px já dão a área de toque */
/* Links Comprar / Combos / Rastreio em pílula no hover */
.dd-cabecalho-links .elementor-nav-menu a { border-radius: 999px; transition: background-color 0.2s; }
.dd-cabecalho-links .elementor-nav-menu a:hover { background: var(--pc-blush); }
/* A busca abre como um cartão logo abaixo da cápsula */
.dd-cabecalho .dd-busca { top: calc(100% + 8px); right: 8px; border-radius: 20px; }
/* ---------- Cabeçalho inteiro no topo, cápsula ao rolar (dono, 30/09/2026) ----------
   No topo da página o cabeçalho é uma barra branca de ponta a ponta (sem cantos, sem sombra), e o banner começa
   abaixo dela. Assim que a página rola (classe is-passou, assets/js/cabecalho.js), a faixa perde o fundo e o
   miolo vira a cápsula branca com sombra, que some ao descer e volta ao subir. */
.dd-cabecalho-fixo { background: #fff !important; box-shadow: 0 1px 0 var(--pc-blush); transition: background-color 0.25s, box-shadow 0.25s; }
.dd-cabecalho { position: relative; transition: border-radius 0.25s, box-shadow 0.25s; }
.dd-cabecalho-fixo:not(.is-passou) .dd-cabecalho { border-radius: 0 !important; box-shadow: none !important; }
.dd-cabecalho-fixo.is-passou { background: transparent !important; box-shadow: none; }
.dd-cabecalho-fixo.is-passou .dd-cabecalho { box-shadow: 0 6px 24px rgba(20, 17, 14, 0.14); }
/* ---------- Ícones do cabeçalho, busca e carrinho ---------- */
.dd-cabecalho :is(.elementor-element, .e-con):has(.dd-busca-caixa) { position: static; }
.dd-icone-botao {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 0;
	background: none;
	color: var(--gd-roxo);
	line-height: 0;
	cursor: pointer;
}
.dd-icone-busca { width: 26px; height: 26px; }
.dd-icone-carrinho { width: 28px; height: 28px; }
.dd-carrinho-qtd {
	position: absolute;
	right: -4px;
	bottom: -4px;
	min-width: 16px;
	height: 16px;
	padding: 0 4px;
	border-radius: 999px;
	background: var(--gd-badge);
	color: #fff;
	font: 400 12px/16px var(--gd-fonte);
	text-align: center;
}
.dd-busca {
	position: absolute;
	top: 100%;
	right: 16px;
	z-index: 5;
	display: flex;
	gap: 8px;
	width: min(420px, calc(100vw - 32px));
	padding: 12px;
	background: #fff;
	border-radius: 0 0 15px 15px;
	box-shadow: 0 12px 24px rgba(20, 17, 14, 0.12);
}
.dd-busca[hidden] { display: none; }
.dd-busca input[type="search"] {
	flex: 1;
	min-height: 44px;
	padding: 0 14px;
	border: 1px solid var(--gd-lavanda);
	border-radius: var(--gk-raio, 6px);
	font: 500 15px var(--gd-fonte);
	color: var(--gd-roxo);
}
.dd-busca button {
	min-height: 44px;
	padding: 0 18px;
	border: 0;
	border-radius: var(--gk-raio, 6px);
	background: var(--gd-roxo);
	color: #fff;
	font: 500 14px var(--gd-fonte);
	cursor: pointer;
}
.dd-cabecalho :focus-visible, .elementor-location-footer :focus-visible { outline: 2px solid var(--gd-rosa); outline-offset: 3px; }
@media (max-width: 989px) {
	.dd-icone-busca { width: 24px; height: 24px; }
	.dd-icone-carrinho { width: 22px; height: 22px; }
}
/* Área de toque de ~44px nos ícones pequenos, sem mudar o desenho (pseudo-elemento em volta). */
.dd-cabecalho :is(.elementor-widget-icon a, .elementor-widget-image a), .dd-icone-botao, :is(.elementor-location-footer, .dd-gaveta-popup) .elementor-social-icon { position: relative; }
.dd-cabecalho :is(.elementor-widget-icon a, .elementor-widget-image a)::after, .dd-icone-botao::after, :is(.elementor-location-footer, .dd-gaveta-popup) .elementor-social-icon::after { content: ""; position: absolute; inset: -11px; }
/* Campo de busca aberto (404 e busca sem resultado) */
.dd-busca.dd-busca--aberta { position: static; width: 100%; max-width: 520px; padding: 0; background: none; box-shadow: none; }
.dd-sem-resultados { display: grid; gap: 16px; margin-top: 8px; font-family: var(--gd-fonte); color: var(--gd-roxo); }
.dd-sem-resultados p { margin: 0; }
.dd-sem-resultados-cats { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.dd-sem-resultados-cats a {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	padding: 0 16px;
	border-radius: var(--gk-raio, 6px);
	background: #E9E1D6;
	color: var(--gd-roxo);
	font-weight: 600;
	text-decoration: none;
}
.dd-sem-resultados-cats a:hover { background: var(--gd-lavanda); }
/* ---------- Rodapé: colunas em sanfona no celular ---------- */
@media (max-width: 989px) {
	.dd-rodape-col .elementor-heading-title { display: flex; align-items: flex-start; justify-content: space-between; height: 40px; cursor: pointer; }
	.dd-rodape-col .elementor-heading-title::after {
		content: "";
		width: 9px;
		height: 9px;
		margin: 4px 4px 0 0;
		border-right: 2px solid currentColor;
		border-bottom: 2px solid currentColor;
		transform: rotate(45deg);
		transition: transform 0.2s ease;
	}
	.dd-rodape-col.is-aberta .elementor-heading-title::after { transform: rotate(-135deg); margin-top: 8px; }
	.dd-rodape-col:not(.is-aberta) .elementor-widget-icon-list { display: none; }
	.dd-rodape-col.is-aberta .elementor-widget-icon-list { padding-bottom: 10px; }
}
@media (prefers-reduced-motion: reduce) {
	.dd-barra-lista .dd-rolando { animation: none; }
	.dd-cabecalho-fixo { transition: none; }
}
/* E-mail longo nas colunas do rodapé quebra a linha em vez de vazar. */
.dd-rodape-col .elementor-icon-list-text { overflow-wrap: anywhere; }