/*
 * Cabeçalho: fixo no topo, azul-escuro, com logo, menu e botão Buscar.
 * Encolhe ao rolar: as regras do cabeçalho compacto ficam em cabecalho-compacto.css (fora do CSS usado do WP Rocket;
 * ver ddv_tema_cabecalho_compacto_fora_do_rucss em functions.php).
 * As regras de posição valem só no site (.wp-site-blocks), não no editor.
 */

.wp-site-blocks > header.wp-block-template-part {
	position: fixed;
	top: var(--wp-admin--admin-bar--height, 0px);
	left: 0;
	right: 0;
	z-index: 100;
	transition: box-shadow .25s ease;
}
.wp-site-blocks { padding-top: var(--wp--custom--cabecalho--altura); }
.wp-site-blocks > * { margin-block-start: 0; }

.ddv-cabecalho__barra {
	height: var(--wp--custom--cabecalho--altura);
	gap: 24px;
	transition: height .25s ease;
}

/* Logo: 52 px de altura (38 px compacto). */
.ddv-cabecalho__logo { margin: 0; flex: none; }
.ddv-cabecalho__logo img { display: block; width: auto !important; height: 52px; transition: height .25s ease; }

/* Menu principal. */
.ddv-cabecalho__menu .wp-block-navigation__container { gap: clamp(32px, 8vw, 120px); }
.ddv-cabecalho__menu .wp-block-navigation-item__content {
	font-size: var(--wp--preset--font-size--large);
	font-weight: 600;
	text-decoration: none;
	transition: font-size .25s ease;
}
.ddv-cabecalho__menu .wp-block-navigation-item__content:hover { color: var(--wp--preset--color--surface-accent); }

/* Botão Buscar: amarelo, com a lupa do tema antes do texto. */
.ddv-cabecalho__acoes { flex: none; }
.ddv-botao-busca .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	height: 48px;
	padding: 0 24px 0 22px;
	border-radius: var(--wp--custom--radius--2-xl);
	font-size: var(--wp--preset--font-size--medium);
	transition: height .25s ease, background-color .2s ease;
}
.ddv-botao-busca .wp-block-button__link::before {
	content: "";
	width: 20px;
	height: 20px;
	flex: none;
	background: currentColor;
	-webkit-mask: url(../icons/busca.svg) center / contain no-repeat;
	mask: url(../icons/busca.svg) center / contain no-repeat;
}

/* Foco visível em amarelo sobre o azul. */
.ddv-cabecalho :is(a, button):focus-visible { outline: 3px solid var(--wp--preset--color--surface-accent); outline-offset: 2px; }

/* Menu aberto no celular (painel do bloco Navegação). */
.ddv-cabecalho__menu .wp-block-navigation__responsive-container.is-menu-open { padding: 24px 30px; }
.ddv-cabecalho__menu .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: 8px; }
.ddv-cabecalho__menu .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-size: var(--wp--preset--font-size--xx-large); padding-block: 8px; }
.ddv-cabecalho__menu :is(.wp-block-navigation__responsive-container-open, .wp-block-navigation__responsive-container-close) {
	width: 44px;
	height: 44px;
	align-items: center;
	justify-content: center;
	border-radius: 999px;
}
.ddv-cabecalho__menu :is(.wp-block-navigation__responsive-container-open, .wp-block-navigation__responsive-container-close) svg { width: 28px; height: 28px; }

@media (max-width: 760px) {
	/* O bloco Navegação só vira menu de celular abaixo de 600 px; o DS pede até 760 px. */
	.ddv-cabecalho__menu .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.ddv-cabecalho__menu .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }

	.ddv-cabecalho__barra { gap: 4px; }
	.ddv-cabecalho__logo { margin-right: auto; }
	/* Ordem no celular: logo, lupa, menu (o botão do menu fica no canto, como na prévia). */
	.ddv-cabecalho__acoes { order: 1; }
	.ddv-cabecalho__menu { order: 2; }
	.ddv-cabecalho__logo img { height: 40px; }

	/* Buscar vira só a lupa, com área de toque de 44 px; o texto continua para leitores de tela. */
	.ddv-botao-busca .wp-block-button__link {
		width: 44px;
		height: 44px;
		padding: 0;
		justify-content: center;
		border-radius: 999px;
		background: transparent;
		color: var(--wp--preset--color--text-inverse);
		font-size: 0;
	}
	.ddv-botao-busca .wp-block-button__link::before { width: 24px; height: 24px; }
	.ddv-botao-busca .wp-block-button__link:hover { background: rgb(255 255 255 / 12%); }
}

@media (prefers-reduced-motion: reduce) {
	.wp-site-blocks > header.wp-block-template-part,
	.ddv-cabecalho__barra,
	.ddv-cabecalho__logo img,
	.ddv-cabecalho__menu .wp-block-navigation-item__content,
	.ddv-botao-busca .wp-block-button__link { transition: none; }
}

/* Celular: cabeçalho mais baixo (64 px; 52 px compacto). */
@media (max-width: 760px) {
	:root, body { --wp--custom--cabecalho--altura: 64px; --wp--custom--cabecalho--altura-compacta: 52px; }
}