/**
 * Multdivision Storefront: classes utilitárias versionadas (prefixo mdc-).
 * Aplicadas no campo "Classe CSS adicional" de qualquer bloco.
 * Remover ou renomear uma classe é mudança de versão maior.
 */

/*
 * Breakpoints do framework (contrato público, ver CONTRATO-PAI-FILHO.md):
 *   sm  600 px  celular → tablet (mesmo valor do núcleo do WordPress)
 *   md  782 px  colunas empilham (núcleo do WordPress)
 *   lg 1024 px  navegação: abaixo, menu recolhido; acima, menu horizontal
 */

/* Visibilidade por dispositivo. */
@media (max-width: 599px) {
	.mdc-hide-sm {
		display: none !important;
	}
}

@media (max-width: 781px) {
	.mdc-hide-mobile {
		display: none !important;
	}
}

@media (min-width: 782px) {
	.mdc-hide-desktop {
		display: none !important;
	}
}

/* Capa (Cover) sem altura mínima no celular: o conteúdo começa logo abaixo do cabeçalho. */
@media (max-width: 781px) {
	.wp-block-cover.mdc-cover-auto-mobile {
		min-height: 0 !important;
		padding-block: var(--wp--preset--spacing--60);
	}
}

/* Elemento fixo ao rolar, sem deslocar o layout. */
.mdc-sticky {
	position: sticky;
	top: 0;
	z-index: 50;
}

/*
 * Animações de entrada.
 * O conteúdo só fica oculto depois que o script marca o documento com
 * .mdc-reveal-ready. Sem JavaScript, tudo aparece normalmente.
 */
.mdc-reveal-ready :is(.mdc-anim-fade, .mdc-anim-up, .mdc-anim-stagger > *):not(.is-revealed) {
	opacity: 0;
}

.mdc-reveal-ready .mdc-anim-up:not(.is-revealed),
.mdc-reveal-ready .mdc-anim-stagger > *:not(.is-revealed) {
	transform: translateY(var(--wp--custom--motion--distance));
}

.mdc-reveal-ready :is(.mdc-anim-fade, .mdc-anim-up, .mdc-anim-stagger > *) {
	transition:
		opacity var(--wp--custom--motion--duration) var(--wp--custom--motion--easing),
		transform var(--wp--custom--motion--duration) var(--wp--custom--motion--easing);
}

.mdc-anim-stagger > *:nth-child(2) { transition-delay: 80ms; }
.mdc-anim-stagger > *:nth-child(3) { transition-delay: 160ms; }
.mdc-anim-stagger > *:nth-child(4) { transition-delay: 240ms; }
.mdc-anim-stagger > *:nth-child(n + 5) { transition-delay: 320ms; }

/*
 * Movimento automático (opcional; filtro mdc_storefront_movimento_automatico, ligado pelo Essentials).
 * O <html> recebe .mdc-mov-auto por um script curto no <head>, antes da primeira pintura, só quando o
 * visitante não pediu menos movimento. Cada elemento fica parado no primeiro quadro da animação e anda
 * quando entra na tela (.is-revealed). Se o script principal não carregar, .mdc-mov-fim libera tudo em 2,5 s.
 * Não vale em carrinho, checkout e Minha conta.
 */
/* Blocos com gaveta fixa (filtros do celular, minicarrinho) não entram: um transform no ancestral prenderia a
   gaveta dentro do bloco em vez da tela. Os cartões de produto dentro deles continuam com movimento. */
@keyframes mdc-entrada {
	from {
		opacity: 0;
		transform: translateY(var(--wp--custom--motion--distance, 16px));
	}
	to {
		opacity: 1;
		transform: none;
	}
}

.mdc-mov-auto :where(
	main .wp-block-post-content > :not(.mdc-anim-fade):not(.mdc-anim-up):not(.mdc-anim-stagger),
	main > :not(.wp-block-post-content):not(.wp-block-woocommerce-breadcrumbs):not(.wp-block-woocommerce-store-notices):not(:has(.wp-block-woocommerce-product-filters, .wp-block-woocommerce-mini-cart)),
	.wp-block-woocommerce-product-template > li,
	.mdc-term-children__list > *,
	main .is-layout-grid > *
) {
	animation: mdc-entrada var(--wp--custom--motion--duration, 600ms) var(--wp--custom--motion--easing, ease) both paused;
	animation-delay: var(--mdc-mov-atraso, 0ms);
}

.mdc-mov-auto :where(
	main .wp-block-post-content > *,
	main > *,
	.wp-block-woocommerce-product-template > li,
	.mdc-term-children__list > *,
	main .is-layout-grid > *
).is-revealed,
.mdc-mov-auto.mdc-mov-fim :where(main *, .wp-block-woocommerce-product-template > li) {
	animation-play-state: running;
}

@media print {
	.mdc-mov-auto * {
		animation: none !important;
	}
}

/* Parallax leve: o script ajusta --mdc-parallax-y; desligado no mobile. */
.mdc-parallax-leve {
	transform: translate3d(0, var(--mdc-parallax-y, 0), 0);
	will-change: transform;
}

@media (max-width: 767px) {
	.mdc-parallax-leve {
		transform: none;
		will-change: auto;
	}
}

@media (prefers-reduced-motion: reduce) {
	.mdc-reveal-ready :is(.mdc-anim-fade, .mdc-anim-up, .mdc-anim-stagger > *) {
		opacity: 1 !important;
		transform: none !important;
	}

	.mdc-parallax-leve {
		transform: none !important;
	}

	.mdc-mov-auto * {
		animation: none !important;
	}
}

/* ---------- Colunas de links do rodapé (patterns rodape-*) ---------- */
.mdc-rodape__titulo {
	margin-bottom: var(--wp--preset--spacing--30);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.mdc-rodape__nav {
	row-gap: var(--wp--preset--spacing--20);
}

/* Aviso de revisão nos conteúdos-base de páginas (patterns pagina-*). */
.mdc-nota-revisao {
	margin-block: var(--wp--preset--spacing--40);
}