/* ==========================================================================
   Doce Malicia - header do Elementor (versao simples e responsiva)
   Escopo: body.dm-header-novo .elementor-location-header
   (loja, categorias, produto, carrinho). Home e conta ficam de fora por
   construcao: nao tem .elementor-location-header nem recebem a classe.

   Principios (WPDS + Core Web Vitals):
   - nada de seletor por data-id: IDs do Elementor mudam ao recriar widgets;
   - nada de altura fixa que estoura: barras medem o conteudo (CLS);
   - alvos de toque >= 44px; um buscador so (o original do plugin);
   - menu abre no hover/foco no desktop e pelo toggle do Elementor no mobile.
   ========================================================================== */

body.dm-header-novo .elementor-location-header {
	--hd-gutter: clamp(12px, 3vw, 28px);
	--hd-suporte: #ffffff;
	--hd-fundo: #f6f6f8;
	--hd-faixa: #15151a;
	--hd-tinta: #16161c;
	--hd-fraco: #6b6b78;
	--hd-linha: rgba(16, 16, 24, .10);
	--hd-marca: var(--bs-primary, #da3c3c);
	--hd-raio: 10px;
	--hd-sombra: 0 10px 30px -12px rgba(16, 16, 24, .28);
}

/* Qualquer resto do formulario nativo injetado antes: some sempre.
   Mantem UM buscador: o original do plugin, que o usuario prefere. */
body.dm-header-novo .elementor-location-header .dm-busca-mobile {
	display: none !important;
}

/* Containers do Elementor: podem quebrar linha em vez de sobrepor. */
body.dm-header-novo .elementor-location-header .e-parent {
	flex-wrap: wrap;
	row-gap: 8px;
}

body.dm-header-novo .elementor-location-header .e-parent > .e-child {
	min-width: 0;
	max-width: 100%;
}

/* Imagens nunca estouram. */
body.dm-header-novo .elementor-location-header img {
	max-width: 100%;
	height: auto;
}

/* Logo com tamanho controlado. */
body.dm-header-novo .elementor-location-header .elementor-widget-theme-site-logo img {
	max-height: 54px;
	width: auto;
	object-fit: contain;
}

/* --------------------------------------------------------------------------
   Menu principal: horizontal com quebra permitida (nunca sobrepoe).
   -------------------------------------------------------------------------- */
body.dm-header-novo .elementor-location-header .elementor-nav-menu--main .elementor-nav-menu {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	column-gap: 22px;
	row-gap: 2px;
}

body.dm-header-novo .elementor-location-header .elementor-nav-menu--main .elementor-nav-menu > li > a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 4px 2px;
	color: var(--hd-tinta);
	font-size: 14.5px;
	font-weight: 600;
	line-height: 1.25;
	white-space: nowrap;
	text-decoration: none;
}

body.dm-header-novo .elementor-location-header .elementor-nav-menu--main .elementor-nav-menu > li > a:hover,
body.dm-header-novo .elementor-location-header .elementor-nav-menu--main .elementor-nav-menu > li.current-menu-item > a {
	color: var(--hd-marca);
}

/* Submenu de categorias: abre no hover e no foco (teclado) no desktop.
   No mobile o Elementor controla pelo toggle; aqui nao se forca nada. */
@media (min-width: 1025px) {
	body.dm-header-novo .elementor-location-header .elementor-nav-menu--main .elementor-nav-menu > li {
		position: relative;
	}

	body.dm-header-novo .elementor-location-header .elementor-nav-menu--main .elementor-nav-menu > li:hover > ul.sub-menu,
	body.dm-header-novo .elementor-location-header .elementor-nav-menu--main .elementor-nav-menu > li:focus-within > ul.sub-menu {
		display: block;
	}

	body.dm-header-novo .elementor-location-header .elementor-nav-menu--main .elementor-nav-menu > li > ul.sub-menu {
		position: absolute;
		top: 100%;
		left: 0;
		z-index: 50;
		min-width: 240px;
		max-width: min(320px, 80vw);
		max-height: min(70vh, 520px);
		overflow-y: auto;
		background: var(--hd-suporte);
		border: 1px solid var(--hd-linha);
		border-radius: var(--hd-raio);
		box-shadow: var(--hd-sombra);
		padding: 6px;
		margin: 0;
	}

	body.dm-header-novo .elementor-location-header .elementor-nav-menu--main .elementor-nav-menu > li > ul.sub-menu > li > a {
		display: flex;
		align-items: center;
		min-height: 40px;
		padding: 6px 10px;
		color: var(--hd-fraco);
		font-size: 13.5px;
		line-height: 1.35;
		border-radius: 8px;
		white-space: normal;
	}

	body.dm-header-novo .elementor-location-header .elementor-nav-menu--main .elementor-nav-menu > li > ul.sub-menu > li > a:hover {
		color: var(--hd-marca);
		background: var(--hd-fundo);
	}

	body.dm-header-novo .elementor-location-header .elementor-nav-menu--main .elementor-nav-menu ul.sub-menu ul.sub-menu {
		left: 100%;
		top: 0;
	}
}

/* --------------------------------------------------------------------------
   Busca original do plugin: ocupa o espaco, nunca estoura.
   -------------------------------------------------------------------------- */
body.dm-header-novo .elementor-location-header .dgwt-wcas-search-wrapp,
body.dm-header-novo .elementor-location-header .dgwt-wcas-search-form,
body.dm-header-novo .elementor-location-header .dgwt-wcas-sf-wrapp {
	width: 100%;
	max-width: 100%;
}

body.dm-header-novo .elementor-location-header .dgwt-wcas-search-input {
	width: 100% !important;
	max-width: 100%;
	min-height: 44px;
	box-sizing: border-box;
}

/* A cadeia do plugin media 391px numa barra de 380px (11px para fora).
   Trava generica e segura: largura maxima e margem zerada, sem mexer em
   altura (o motivo do bug anterior). Nao usa overflow:hidden para nao
   cortar as sugestoes ao digitar. */
body.dm-header-novo .elementor-location-header .dgwt-wcas-search-wrapp,
body.dm-header-novo .elementor-location-header .dgwt-wcas-search-form,
body.dm-header-novo .elementor-location-header .dgwt-wcas-sf-wrapp,
body.dm-header-novo .elementor-location-header .dgwt-wcas-search-input {
	max-width: 100%;
	margin-left: 0;
	margin-right: 0;
	box-sizing: border-box;
}

/* --------------------------------------------------------------------------
   Sociais em linha unica com quebra segura.
   -------------------------------------------------------------------------- */
body.dm-header-novo .elementor-location-header .elementor-social-icons-wrapper {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}

body.dm-header-novo .elementor-location-header .elementor-social-icon {
	min-width: 44px;
	min-height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* Carrinho com alvo de toque. */
body.dm-header-novo .elementor-location-header .elementor-menu-cart__toggle_button {
	min-height: 44px;
}

/* --------------------------------------------------------------------------
   Mobile (<=767px): empilha sem sobrepor.
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {
	body.dm-header-novo .elementor-location-header .elementor-widget-theme-site-logo img {
		max-height: 38px;
	}

	body.dm-header-novo .elementor-location-header .dgwt-wcas-search-input {
		font-size: 16px; /* evita zoom automatico no iOS */
	}
}
