/* ==============================================================
   Audaxco — Header: Compactação & UX
   @version 1.7.3 (2026-06-18)
   @changelog
     1.7.3 - Mobile: submenu sanfona cortava categorias (parava em "Limpa Vidros",
             escondia "Sabonetes" em diante); max-height do submenu aberto
             800px -> 1600px p/ caber as 24 categorias com folga.
     1.7.2 - Prevent mobile search blur and add search icon inside the field.
     1.7.1 - Mobile drawer search field with Ivory Search autocomplete.
     1.7.0 — Remove padding-top:0 do bt-content-wrap (conflitava com margin-top
             do hero-slider v1.3.0 que agora posiciona a seção após o header)
     1.6.0 — Seção 12: migração Smart Slider 3 → audaxco_hero_slider custom;
             regras SS3 mantidas comentadas; hero-slider.css gerencia o slider
     1.5.11 — Breakpoint ícone-only volta para 1570px
     1.5.10 — Breakpoint ícone-only 1570→1320px; zera margin do icon sem label
     1.5.9 — Padding do a: 20px; li volta para 4px
     1.5.8 — Aumenta padding do li de 4px para 12px
     1.5.7 — Fixa left/right:0 no ::before (tema usava -25px); remove overflow trick
     1.5.6 — Corrige hover::before min/max-height 50→46px; overflow:hidden no li
     1.5.5 — Fixa height:46px no a (hover correto); li padding 4px; zero v-padding no a
     1.5.4 — Zera padding: 0 50px do li do tema no nav
     1.5.3 — Reduz padding horizontal nav 12→10px; row-height 52→46px
     1.5.2 — Remove top/transform do topBarInLogoArea (causava botões acima do nav)
     1.5.1 — Cor branca nos links nav (btLightDarkHeader sobrescrita); font-size 12px
     1.5.0 — Seções 13-14: layout single-row (horizontal-right);
             nav inline com logo+CTAs; breakpoint 1570px ícone-only
     1.4.0 — Seção 5: scroll do dropdown restrito a menus sem 3º nível
             via :not(:has(> li > ul)); corrige sub-submenu do Serviços
             (overflow-x hidden; scrollbar só onde não há sub-submenu)
     1.2.0 — Seção 12: remove margin-top que causava scroll ao clicar seta
             do Smart Slider 3; usa height:100vh puro (seção em y=0)
     1.1.0 — Seção 12: slider home 100vh com margin-top dinâmico
             via --header-height (CSS var exposta pelo header.misc.js)
     1.0.0 — Versão inicial: compactação, sticky, dropdown, busca
   Carregado APÓS amwerk-style, sobrescreve os valores dinâmicos
   do css-override.php (logoHeight padrão = 120px).

   Layout real do site: btMenuBelowLogo
     · Linha 1 (.bt-logo-area):  logo  |  Catálogo  Portal B2B
     · Linha 2 (.bt-below-logo-area):  nav items  |  search
   ============================================================== */

/* ---------------------------------------------------------------
   1. LOGO — 52 px (compacto mas legível)
   --------------------------------------------------------------- */
.mainHeader .bt-logo-area .logo img.btMainLogo,
.mainHeader .bt-logo-area .logo img.btAltLogo {
	height: 40px !important;
	width: auto;
	transition: height 0.25s ease;
}

.btStickyHeaderActive .mainHeader .bt-logo-area .logo img.btMainLogo,
.btStickyHeaderActive .mainHeader .bt-logo-area .logo img.btAltLogo {
	height: 40px !important;
}

/* ---------------------------------------------------------------
   2. LINHA DO LOGO (.bt-logo-area) — padding reduzido
   --------------------------------------------------------------- */
.mainHeader .bt-logo-area.menu-holder {
	padding-top: 6px !important;
	padding-bottom: 6px !important;
}

.btStickyHeaderActive .mainHeader .bt-logo-area.menu-holder {
	padding-top: 6px !important;
	padding-bottom: 6px !important;
}

/* Padding do logo no layout below-center */
.btMenuHorizontal.btMenuCenterBelow .logo {
	padding: 10px !important;
}

/* Espaçamento entre logo e CTAs — gap uniforme, sem margin extra */
.topBarInLogoArea .btIconWidget {
	margin-left: 0 !important;
}

.mainHeader .bt-logo-area .port {
	display: flex !important;
	align-items: center !important;
}

.mainHeader .bt-logo-area .topBarInLogoArea {
	display: flex !important;
	align-items: center !important;
	margin-left: auto;
	top: auto !important;
	transform: none !important;
}

.mainHeader .bt-logo-area .topBarInLogoAreaCell {
	display: flex !important;
	align-items: center !important;
	gap: 8px;
	margin-top: 0;
}

.btStickyHeaderActive .mainHeader .bt-logo-area .topBarInLogoAreaCell {
	gap: 8px;
	margin-top: 0;
}

/* ---------------------------------------------------------------
   3. LINHA DE NAV (.bt-below-logo-area) — altura compacta
   --------------------------------------------------------------- */
.btMenuHorizontal.btMenuBelowLogo .menuPort nav > ul > li > a,
.btMenuHorizontal.btMenuBelowLogo .menuPort nav > ul > li > .subToggler {
	line-height: 46px !important;
}

.btMenuHorizontal.btMenuBelowLogo .topBarInMenu,
.btMenuHorizontal.btMenuBelowLogo .topBarInMenu .topBarInMenuCell {
	height: 46px !important;
	line-height: 46px !important;
}

/* Centraliza o conteúdo da barra de nav verticalmente */
.btMenuHorizontal.btMenuBelowLogo .topBarInMenu .topBarInMenuCell {
	display: flex !important;
	align-items: center !important;
	line-height: normal !important;
}

/* Dropdown alinha no bottom da barra — só o 2º nível (> li > ul) para não afetar o 3º */
.btMenuHorizontal.btMenuBelowLogo .menuPort > nav > ul > li > ul {
	top: 46px !important;
}

.btMenuHorizontal.btMenuBelowLogo .menuPort nav > ul {
	margin-left: 0 !important;
}

/* Sticky */
.btStickyHeaderActive.btMenuHorizontal.btMenuBelowLogo .menuPort nav > ul > li > a,
.btStickyHeaderActive.btMenuHorizontal.btMenuBelowLogo .menuPort nav > ul > li > .subToggler {
	line-height: 40px !important;
}

.btStickyHeaderActive.btMenuBelowLogo.btMenuHorizontal .mainHeader .bt-logo-area {
	display: block !important;
}

.btStickyHeaderActive.btMenuHorizontal.btMenuBelowLogo .menuPort > nav > ul > li > ul {
	top: 40px !important;
}

/* ---------------------------------------------------------------
   4. ITENS DE NAV — espaçamento e tipografia
   --------------------------------------------------------------- */

/* O tema define padding: 0 50px 0 0 no li — reduz para espaçamento compacto */
.btMenuHorizontal .menuPort > nav > ul > li {
	padding: 0 4px !important;
}

.menuPort nav > ul > li > a {
	padding-left: 20px !important;
	padding-right: 20px !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	font-size: 12px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	transition: color 0.2s ease;
}

/* Smooth reveal da linha de hover (pseudo-elements do tema) */
.btMenuHorizontal .menuPort nav > ul > li > a::after,
.btMenuHorizontal .menuPort nav > ul > li > a::before {
	transition: transform 0.22s ease, opacity 0.22s ease !important;
}

/* O tema define min/max-height: 50px no ::before do hover (hardcoded),
   e left/right: calc(-50px/2) = -25px — causando vazamento para cima/baixo
   e para os lados dos itens vizinhos. Corrige para caber exatamente no item. */
.btMenuHorizontal:not(.btMenuBelowLogo) .menuPort nav > ul > li > a::before {
	min-height: 46px !important;
	max-height: 46px !important;
	left: 0 !important;
	right: 0 !important;
}


/* ---------------------------------------------------------------
   5. DROPDOWN — visual limpo e moderno
   --------------------------------------------------------------- */
.btMenuHorizontal .menuPort ul ul {
	min-width: 230px;
	box-shadow: 0 8px 28px rgba(0, 0, 0, 0.14) !important;
	border-radius: 0 0 8px 8px !important;
	border-top: 3px solid #004991 !important;
	overflow: visible; /* era hidden — impedia o sub-dropdown de 3º nível (left:100%) de aparecer */
}

/* Limita a altura do dropdown de 1º nível para não ultrapassar o viewport.
   :not(:has(> li > ul)) exclui dropdowns com 3º nível (ex: Serviços), onde
   overflow-y:auto quebraria o sub-submenu posicionado via left:100%. */
.btMenuHorizontal .menuPort > nav > ul > li > ul:not(:has(> li > ul)) {
	max-height: 70vh;
	overflow-y: auto;
	overflow-x: hidden;
}

/* Scrollbar discreta no dropdown (apenas nos que têm scroll ativo) */
.btMenuHorizontal .menuPort > nav > ul > li > ul:not(:has(> li > ul))::-webkit-scrollbar {
	width: 5px;
}
.btMenuHorizontal .menuPort > nav > ul > li > ul:not(:has(> li > ul))::-webkit-scrollbar-track {
	background: transparent;
}
.btMenuHorizontal .menuPort > nav > ul > li > ul:not(:has(> li > ul))::-webkit-scrollbar-thumb {
	background: rgba(14, 81, 172, 0.25);
	border-radius: 4px;
}
.btMenuHorizontal .menuPort > nav > ul > li > ul:not(:has(> li > ul))::-webkit-scrollbar-thumb:hover {
	background: rgba(14, 81, 172, 0.45);
}
/* Firefox */
.btMenuHorizontal .menuPort > nav > ul > li > ul:not(:has(> li > ul)) {
	scrollbar-width: thin;
	scrollbar-color: rgba(14, 81, 172, 0.25) transparent;
}

/* Manter as bordas arredondadas no primeiro e último item da lista */
.btMenuHorizontal .menuPort ul ul > li:first-child > a {
	border-radius: 0 !important;
}
.btMenuHorizontal .menuPort ul ul > li:last-child > a {
	border-radius: 0 0 8px 8px !important;
}

/* O fundo branco dos itens precisa preencher os cantos do dropdown */
.btMenuHorizontal .menuPort ul ul > li {
	background-color: #fff;
}

.btMenuHorizontal .menuPort ul ul li > a {
	padding-top: 11px !important;
	padding-bottom: 11px !important;
	padding-left: 22px !important;
	font-size: 13px;
	transition: background-color 0.15s ease, padding-left 0.15s ease !important;
}

.btMenuHorizontal .menuPort ul ul li:hover > a {
	background-color: #edf4fa !important;
	padding-left: 28px !important;
}

/* O li dentro do dropdown precisa de position: relative para que
   o ul do 3º nível se posicione em relação a ele (não ao ul pai) */
.btMenuHorizontal .menuPort ul ul li {
	position: relative;
}

/* Sub-dropdown de segundo nível (ex.: Universidade → Matrícula…) */
.btMenuHorizontal .menuPort ul ul ul {
	top: 0 !important; /* alinha com o topo do li pai (position: relative acima) */
	left: 100% !important;
	border-top: 3px solid #004991 !important;
	border-radius: 0 8px 8px 8px !important;
}

/* Esconde o quadradinho nativo do tema (a:before no item com sub-submenu) */
.btMenuHorizontal .menuPort nav > ul > li:not(.btMenuWideDropdown) > ul > li.menu-item-has-children > a:before {
	display: none !important;
}

/* Chevron nos itens do dropdown que têm sub-submenu:
   troca o ícone padrão (chevron-down) por chevron-right e
   desativa a rotação que o tema aplica ao abrir (.on) */
.btMenuHorizontal .menuPort ul ul li .subToggler {
	display: block !important;
	right: 22px;
	top: 50% !important;
	transform: translateY(-50%) !important;
	line-height: 1;
	padding: 0;
	width: auto;
	opacity: 1;
	transition: opacity 0.2s ease;
}

.btMenuHorizontal .menuPort ul ul li .subToggler:before {
	content: "\f105"; /* fa-chevron-right */
	font: normal 13px/1 FontAwesome;
	color: #004991;
}

/* Remove a rotação do tema — chevron-right não deve girar */
.btMenuHorizontal .menuPort ul ul li.on > .subToggler {
	transform: translateY(-50%) !important;
	opacity: 1;
}

/* O JS do tema faz prepend() de um segundo .subToggler quando o WP já renderiza um.
   Esconde o duplicado (irmão seguinte com a mesma classe). */
.btMenuHorizontal .menuPort ul ul li .subToggler + .subToggler {
	display: none !important;
}

/* ---------------------------------------------------------------
   6. BUSCA — ícone de lupa que expande ao clicar
      O JS (header-search.js) move .widget_is_search para cá e
      esconde o .topBarInMenu original (que fica vazio).
   --------------------------------------------------------------- */

/* Wrapper do toggle + input na linha do logo */
.audaxco-header-search {
	display: flex;
	align-items: center;
	position: relative;
}

/* Botão de lupa */
.audaxco-search-toggle {
	background: transparent;
	border: none;
	cursor: pointer;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	padding: 0;
	flex-shrink: 0;
	transition: background 0.2s ease;
}

.audaxco-search-toggle:hover {
	background: rgba(255, 255, 255, 0.16);
}

.audaxco-search-toggle svg {
	width: 17px;
	height: 17px;
	stroke: #fff;
	stroke-width: 2.5;
	fill: none;
	display: block;
}

/* Esconder o widget de busca por padrão (só o formulário expande) */
.audaxco-header-search .btTopBox.widget_is_search {
	overflow: hidden;
	max-width: 0;
	opacity: 0;
	transition: max-width 0.35s ease, opacity 0.25s ease;
}

/* Estado aberto */
.audaxco-header-search.is-open .btTopBox.widget_is_search {
	max-width: 220px;
	opacity: 1;
}

/* Input expandido — mesma altura dos botões CTA (~34 px) */
.audaxco-header-search .is-search-input,
.audaxco-header-search input.is-search-input[type="search"] {
	width: 200px !important;
	height: 34px !important;
	padding: 0 14px !important;
	font-size: 12px;
	border-radius: 4px !important;
	border: 1px solid rgba(255, 255, 255, 0.55) !important;
	background: rgba(255, 255, 255, 0.12) !important;
	color: #fff !important;
	box-sizing: border-box !important;
	outline: none;
	transition: border-color 0.2s ease, background 0.2s ease !important;
}

.audaxco-header-search .is-search-input::placeholder {
	color: rgba(255, 255, 255, 0.6);
}

.audaxco-header-search .is-search-input:focus,
.audaxco-header-search input.is-search-input[type="search"]:focus {
	border-color: rgba(255, 255, 255, 0.9) !important;
	background: rgba(255, 255, 255, 0.2) !important;
}

.audaxco-mobile-search {
	display: none;
}

/* Esconder o .topBarInMenu original (JS também faz display:none,
   mas esse fallback garante caso o JS demore) */
.btMenuHorizontal.btMenuBelowLogo .topBarInMenu .widget_is_search {
	display: none;
}

/* ---------------------------------------------------------------
   7. CTAs DO TOPO — Catálogo (.bt_button_widget_dark)
                   e Portal B2B (.bt_button_widget_light)
   --------------------------------------------------------------- */
.topBarInLogoArea a.bt_button_widget {
	padding: 5px 14px !important;
	font-size: 12px !important;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	border-radius: 4px !important;
	height: 38px !important;
	line-height: 38px !important;
	transition: background-color 0.25s ease, color 0.25s ease,
		transform 0.25s ease, box-shadow 0.25s ease,
		border-color 0.25s ease !important;
	display: inline-flex !important;
	align-items: center;
	gap: 6px;
}

.topBarInLogoArea .audaxco-header-guide {
	text-decoration: none;
	white-space: nowrap;
	height: 38px !important;
	line-height: 38px !important;
	padding: 5px 14px !important;
	font-size: 11px !important;
	font-family: "Assistant", Arial, Helvetica, sans-serif;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	background: transparent !important;
	color: #fff !important;
	border: 1px solid rgba(255, 255, 255, 0.55) !important;
	box-shadow: none !important;
	border-radius: 4px !important;
	display: inline-flex !important;
	align-items: center;
	gap: 6px;
	transition: background-color 0.25s ease, color 0.25s ease,
		transform 0.25s ease, box-shadow 0.25s ease,
		border-color 0.25s ease !important;
}

.topBarInLogoArea .audaxco-header-guide:hover {
	background: rgba(255, 255, 255, 0.15) !important;
	border-color: rgba(255, 255, 255, 0.8) !important;
	transform: translateY(-1px) !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12) !important;
}

.audaxco-header-guide .audaxco-header-cta-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 15px;
	height: 15px;
	flex-shrink: 0;
	opacity: 0.95;
}

.audaxco-header-guide .audaxco-header-cta-icon svg {
	width: 15px;
	height: 15px;
	display: block;
}

.audaxco-header-guide .audaxco-header-cta-label-short {
	display: none;
}

/* Catálogo — ghost/outline */
.topBarInLogoArea a.bt_button_widget_dark {
	background: transparent !important;
	color: #fff !important;
	border: 1px solid rgba(255, 255, 255, 0.55) !important;
	box-shadow: none !important;
}

.topBarInLogoArea a.bt_button_widget_dark:hover {
	background: rgba(255, 255, 255, 0.15) !important;
	border-color: rgba(255, 255, 255, 0.8) !important;
	transform: translateY(-1px) !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12) !important;
}

/* Portal B2B — CTA primário sólido */
.topBarInLogoArea a.bt_button_widget_light {
	background: #fff !important;
	color: #004991 !important;
	border: 1px solid #fff !important;
	box-shadow: none !important;
}

.topBarInLogoArea a.bt_button_widget_light:hover {
	background: #e4f0f9 !important;
	border-color: #e4f0f9 !important;
	color: #004991 !important;
	transform: translateY(-1px) !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12) !important;
}

.topBarInLogoArea a.bt_button_widget .bt_bb_icon_holder {
	font-size: 14px;
}

/* Altura uniforme dos botões CTA */
.btIconWidget.widget_bt_button_widget .bt_button_widget {
	height: 38px !important;
	line-height: 38px !important;
	display: inline-flex !important;
	align-items: center !important;
}

.btStickyHeaderActive .topBarInLogoArea a.bt_button_widget,
.btStickyHeaderActive .topBarInLogoArea .audaxco-header-guide {
	height: 38px !important;
	line-height: 38px !important;
	padding: 5px 14px !important;
	font-size: 11px !important;
	letter-spacing: 0.05em;
}

.btStickyHeaderActive .audaxco-header-search .is-search-input,
.btStickyHeaderActive .audaxco-header-search input.is-search-input[type="search"] {
	width: 164px !important;
	height: 32px !important;
	padding: 0 12px !important;
}

/* ---------------------------------------------------------------
   8. BACKGROUND + STICKY — sombra ao travar no topo
   --------------------------------------------------------------- */
.mainHeader {
	background-color: #004991 !important;
	transition: box-shadow 0.3s ease;
}

.btMenuInitFinished .mainHeader {
	background-color: #004991 !important;
}

/* Light+Dark Header Style define .mainHeader { background: #fff } — sobrescreve
   para manter o fundo azul no layout single-row */
.btLightDarkHeader .mainHeader {
	background-color: #004991 !important;
}

/* Garante que links do nav fiquem brancos no fundo azul */
.btMenuHorizontal:not(.btMenuBelowLogo) .mainHeader .menuPort nav > ul > li > a,
.btMenuHorizontal:not(.btMenuBelowLogo) .mainHeader .menuPort nav > ul > li > .subToggler {
	color: #fff !important;
}

.btStickyHeaderActive .mainHeader {
	box-shadow: 0 2px 18px rgba(0, 0, 0, 0.22) !important;
}

/* ---------------------------------------------------------------
   9. RESPONSIVO
   --------------------------------------------------------------- */
@media (max-width: 1280px) {
	.menuPort nav > ul > li > a {
		padding-left: 10px !important;
		padding-right: 10px !important;
		font-size: 12px;
	}

	.topBarInMenu .is-search-input,
	.topBarInMenu input.is-search-input[type="search"] {
		max-width: 138px !important;
		width: 138px !important;
	}

	.topBarInLogoArea a.bt_button_widget,
	.topBarInLogoArea .audaxco-header-guide {
		padding-left: 13px !important;
		padding-right: 13px !important;
		font-size: 11px !important;
	}

	.audaxco-header-search .is-search-input,
	.audaxco-header-search input.is-search-input[type="search"] {
		width: 160px !important;
	}
}

@media (max-width: 1180px) {
	.audaxco-header-guide .audaxco-header-cta-label-full {
		display: none;
	}

	.audaxco-header-guide .audaxco-header-cta-label-short {
		display: inline;
	}
}

@media (max-width: 768px) {
	.mainHeader .bt-logo-area.menu-holder {
		padding-top: 8px !important;
		padding-bottom: 8px !important;
	}

	.mainHeader .bt-logo-area .logo img.btMainLogo,
	.mainHeader .bt-logo-area .logo img.btAltLogo {
		height: 34px !important;
	}

	.btMenuHorizontal.btMenuBelowLogo .bt-below-logo-area {
		display: none !important;
	}

	.mainHeader .bt-logo-area .port {
		gap: 8px;
	}

	.mainHeader .bt-logo-area .logo {
		flex: 1 1 auto;
		min-width: 0;
	}

	.mainHeader .bt-logo-area .topBarInLogoArea {
		margin-left: auto;
	}

	.mainHeader .bt-logo-area .topBarInLogoAreaCell {
		gap: 6px;
		margin-top: 0;
	}

	.audaxco-header-search,
	.topBarInLogoArea a.bt_button_widget_dark {
		display: none !important;
	}

	.topBarInLogoArea .audaxco-header-guide,
	.topBarInLogoArea a.bt_button_widget_light {
		height: 34px !important;
		line-height: 34px !important;
		padding: 0 12px !important;
		font-size: 10px !important;
		letter-spacing: 0.05em;
	}

	.topBarInLogoArea .audaxco-header-guide {
		order: 1;
	}

	.topBarInLogoArea a.bt_button_widget_light {
		order: 2;
	}

	.audaxco-header-guide .audaxco-header-cta-label-full {
		display: none;
	}

	.audaxco-header-guide .audaxco-header-cta-label-short {
		display: inline;
	}

	.bt-horizontal-menu-trigger {
		display: inline-flex !important;
		order: 4;
		margin: 0 0 0 2px;
		line-height: 34px !important;
		align-items: center;
	}

	body.btShowMenu .bt-horizontal-menu-trigger,
	body.btMenuVertical.btShowMenu .bt-horizontal-menu-trigger {
		display: none !important;
		visibility: hidden !important;
	}

	.bt-horizontal-menu-trigger .bt_bb_icon {
		transform: scale(0.88);
	}

	/* Sidebar oculta no mobile */
	aside.btSidebar {
		display: none !important;
	}

	/* ── 9.x  Barra topo mobile (.bt-vertical-header-top) ── */
	body.btMenuVertical .bt-vertical-header-top {
		background: #004991 !important;
		position: fixed !important;
		height: 64px !important;
		padding: 0 !important;
		align-items: center !important;
	}

	/* Trigger: esconde barrinhas nativas (pseudo-elementos do tema) */
	body.btMenuVertical .bt-vertical-header-top .bt-vertical-menu-trigger .bt_bb_icon:before,
	body.btMenuVertical .bt-vertical-header-top .bt-vertical-menu-trigger .bt_bb_icon:after {
		content: none !important;
		display: none !important;
	}

	body.btMenuVertical .bt-vertical-header-top .bt-vertical-menu-trigger .bt_bb_icon > a:before {
		content: none !important;
		display: none !important;
	}

	/* Trigger: container do SVG injetado via JS */
	body.btMenuVertical .bt-vertical-header-top .bt-vertical-menu-trigger .bt_bb_icon {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		background: transparent !important;
		height: 64px !important;
		width: 56px !important;
		padding: 0 16px !important;
		cursor: pointer;
		color: #fff !important;
	}

	body.btMenuVertical .bt-vertical-header-top .bt-vertical-menu-trigger .bt_bb_icon .audaxco-menu-icon {
		display: block;
		width: 24px;
		height: 24px;
		color: #fff;
		flex-shrink: 0;
	}

	/* Logo: centralizado; padding-right = largura do trigger → simetria real */
	body.btMenuVertical .bt-vertical-header-top .bt-logo-area {
		flex: 1 !important;
		display: flex !important;
		justify-content: center !important;
		align-items: center !important;
		padding-right: 56px !important;
	}

	body.btMenuVertical .bt-vertical-header-top .bt-logo-area .logo img.btMainLogo {
		height: 34px !important;
		width: auto !important;
		max-width: 140px !important;
		display: block;
	}

	body.btMenuVertical .bt-vertical-header-top .bt-logo-area .logo img.btAltLogo {
		display: none !important;
	}
}

/* ---------------------------------------------------------------
   10. CTAs NO RODAPÉ DO DRAWER MOBILE
   --------------------------------------------------------------- */
.audaxco-mobile-ctas {
	display: none;
}

/* Força os widgets e o botão Guia a full-width */
.audaxco-mobile-ctas .btIconWidget,
.audaxco-mobile-ctas .audaxco-mobile-guide {
	width: 100% !important;
	margin: 0 !important;
}

.audaxco-mobile-ctas .btIconWidget .bt_button_widget,
.audaxco-mobile-ctas .audaxco-mobile-guide {
	width: 100% !important;
	height: 48px !important;
	line-height: 1 !important;
	padding: 0 20px !important;
	font-size: 13px !important;
	font-family: "Assistant", Arial, Helvetica, sans-serif;
	font-weight: 700 !important;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	border-radius: 6px !important;
	display: flex !important;
	align-items: center;
	justify-content: center;
	flex-wrap: nowrap;
	white-space: nowrap;
	gap: 8px;
	box-sizing: border-box !important;
	text-decoration: none;
}

/* Catálogo — outline/ghost */
.audaxco-mobile-ctas .btIconWidget .bt_button_widget_dark {
	background: transparent !important;
	color: #fff !important;
	border: 1.5px solid rgba(255, 255, 255, 0.45) !important;
	box-shadow: none !important;
}

/* Guia do Produto — outline/ghost */
.audaxco-mobile-ctas .audaxco-mobile-guide {
	background: transparent !important;
	color: #fff !important;
	border: 1.5px solid rgba(255, 255, 255, 0.45) !important;
	box-shadow: none !important;
}

/* Portal B2B — sólido branco (CTA primário) */
.audaxco-mobile-ctas .btIconWidget .bt_button_widget_light {
	background: #fff !important;
	color: #004991 !important;
	border: 1.5px solid #fff !important;
	box-shadow: none !important;
}

/* Sempre usa o label completo no drawer */
.audaxco-mobile-ctas .audaxco-header-cta-label-short {
	display: none !important;
}

.audaxco-mobile-ctas .audaxco-header-cta-label-full {
	display: inline !important;
}

/* ---------------------------------------------------------------
   12. SLIDER DA HOME — custom hero (audaxco_hero_slider)
       Os estilos do slider em si estão em:
         mu-plugins/audaxco-hero-slider/hero-slider.css
       Este bloco garante que a seção BeBuilder (classe
       "audaxco-hero-section") não adicione scroll extra.

       Para ativar: na seção BeBuilder, Custom CSS Class = "audaxco-hero-section"
       Shortcode:   [audaxco_hero_slider ids="101,102,103"]
   --------------------------------------------------------------- */

/*
   LEGADO — Smart Slider 3 (desativado após migração para audaxco_hero_slider)
   Mantido aqui para referência. Pode ser removido quando o SmartSlider
   não estiver mais ativo em nenhuma página.

@media (min-width: 1200px) {
	.home .bt-content-wrap .bt_bb_wrapper > section:first-child {
		height: 100vh !important;
		min-height: 100vh !important;
		overflow: hidden;
	}
	.home .bt-content-wrap .bt_bb_wrapper > section:first-child > .bt_bb_port {
		height: 100% !important;
		padding: 0 !important;
	}
	.home .bt-content-wrap .bt_bb_wrapper > section:first-child .n2-section-smartslider,
	.home .bt-content-wrap .bt_bb_wrapper > section:first-child [id^="n2ss_"],
	.home .bt-content-wrap .bt_bb_wrapper > section:first-child .n2-ss-slider-box,
	.home .bt-content-wrap .bt_bb_wrapper > section:first-child .n2-ss-slider {
		height: 100% !important;
		min-height: unset !important;
	}
}
*/

/* ---------------------------------------------------------------
   11. MENU VERTICAL MOBILE (btMenuVertical)
   @version 2.2.10 (2026-06-11)
   Drawer lateral: o tema já fornece position:fixed + overflow-y:auto
   no .mainHeader — trabalhamos COM o scroll nativo.
   --------------------------------------------------------------- */

/* ── 11.0  Estrutura do port: preenche o drawer e empurra CTAs ao rodapé ──
   .port tem padding:0 30px no tema (style.css:1328) — zeramos para o drawer.
   align-items: stretch sobrescreve o align-items:center do layout desktop
   (header.css linha ~76) que encolhia a largura do logo.               */
body.btMenuVertical .mainHeader .main-header-inner,
body.btMenuVertical .mainHeader .bt-logo-area {
	min-height: 100%;
}

/* Zera o padding-bottom do bt-logo-area.menu-holder que cria gap sob os CTAs
   (regra do bloco @media 768px: padding-bottom:8px) */
body.btMenuVertical .mainHeader .bt-logo-area.menu-holder {
	padding-bottom: 0 !important;
}

body.btMenuVertical .mainHeader .bt-logo-area .port {
	padding: 0 !important;
	align-items: stretch !important;
	flex-direction: column !important;
	min-height: 100%;
}

/* ── 11.1  Logo: fixo no topo do drawer ── */
body.btMenuVertical .mainHeader .bt-logo-area .logo {
	flex-shrink: 0;
	display: block;
	width: 100%;
	padding: 18px 24px 16px !important;
	text-align: center;
	border-bottom: 1px solid rgba(255, 255, 255, 0.13);
	box-sizing: border-box;
}

body.btMenuVertical .mainHeader .bt-logo-area .logo img.btMainLogo,
body.btMenuVertical .mainHeader .bt-logo-area .logo img.btAltLogo {
	height: auto !important;
	max-height: 44px !important;
	width: auto !important;
	max-width: 148px !important;
	margin: 0 auto;
	display: block;
}

/* ── 11.2  Esconde elementos desnecessários no drawer ── */
body.btMenuVertical .mainHeader .bt-logo-area .topBarInLogoAreaCell,
body.btMenuVertical .mainHeader .audaxco-header-search,
body.btMenuVertical .mainHeader .bt-horizontal-menu-trigger {
	display: none !important;
}

/* ── 11.3  menuPort: flex:1 faz crescer para preencher o espaço restante do port
   (após o logo). Isso garante que os CTAs fiquem sempre no rodapé do drawer
   mesmo quando a nav é curta. O tema usa column-reverse — sobrescrevemos. ── */
body.btMenuVertical .mainHeader .menuPort {
	display: flex !important;
	flex-direction: column !important;
	flex: 1 !important;
	scrollbar-width: thin;
	scrollbar-color: rgba(114, 158, 196, 0.35) transparent;
}

body.btMenuVertical .mainHeader .menuPort::-webkit-scrollbar {
	width: 4px;
}

body.btMenuVertical .mainHeader .menuPort::-webkit-scrollbar-track {
	background: transparent;
}

body.btMenuVertical .mainHeader .menuPort::-webkit-scrollbar-thumb {
	background: rgba(114, 158, 196, 0.35);
	border-radius: 4px;
}

/* Mobile search: open field at the top of the drawer */
body.btMenuVertical .mainHeader .menuPort .audaxco-mobile-search {
	display: block !important;
	flex-shrink: 0;
	position: relative;
	z-index: 4;
	width: 100%;
	padding: 16px 20px 14px;
	background: #004991 !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
	box-sizing: border-box;
}

body.btMenuVertical .mainHeader .menuPort .audaxco-mobile-search::before {
	content: "";
	position: absolute;
	left: 38px;
	top: 39px;
	z-index: 5;
	width: 18px;
	height: 18px;
	transform: translateY(-50%);
	pointer-events: none;
	background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E");
	opacity: 0.88;
}

body.btMenuVertical .audaxco-mobile-search .btTopBox.widget_is_search {
	display: block !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	opacity: 1 !important;
	overflow: visible !important;
}

body.btMenuVertical .audaxco-mobile-search form,
body.btMenuVertical .audaxco-mobile-search .is-form-style,
body.btMenuVertical .audaxco-mobile-search .is-search-form {
	position: relative;
	width: 100% !important;
	margin: 0 !important;
	overflow: visible !important;
}

body.btMenuVertical .audaxco-mobile-search .is-search-input,
body.btMenuVertical .audaxco-mobile-search input.is-search-input[type="search"] {
	width: 100% !important;
	min-width: 0 !important;
	height: 46px !important;
	padding: 0 16px 0 48px !important;
	font-size: 16px !important;
	line-height: 46px !important;
	border-radius: 6px !important;
	border: 1px solid rgba(255, 255, 255, 0.55) !important;
	background: rgba(255, 255, 255, 0.16) !important;
	color: #fff !important;
	box-sizing: border-box !important;
	outline: none !important;
	box-shadow: none !important;
}

body.btMenuVertical .audaxco-mobile-search .is-search-input::placeholder {
	color: rgba(255, 255, 255, 0.72);
}

body.btMenuVertical .audaxco-mobile-search .is-search-input:focus,
body.btMenuVertical .audaxco-mobile-search input.is-search-input[type="search"]:focus {
	background: rgba(255, 255, 255, 0.22) !important;
	border-color: rgba(255, 255, 255, 0.9) !important;
}

body.btMenuVertical .audaxco-mobile-search .is-ajax-search-result,
body.btMenuVertical .audaxco-mobile-search .is-ajax-search-posts,
body.btMenuVertical .audaxco-mobile-search .is-search-sections {
	z-index: 100004 !important;
	width: 100% !important;
	max-height: min(420px, calc(100vh - 190px));
	overflow-y: auto;
	border-radius: 0 0 8px 8px !important;
	box-shadow: 0 14px 34px rgba(0, 0, 0, 0.22) !important;
}

body.btMenuVertical .is-ajax-search-result {
	z-index: 100004 !important;
	max-width: calc(100vw - 40px) !important;
}

/* ── 11.4  Nível 1: itens principais ── */
body.btMenuVertical .mainHeader .bt-logo-area nav {
	padding-top: 0 !important;
}
body.btMenuVertical .mainHeader .menuPort nav > ul {
	text-align: left !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* li vira flex container: a (flex:1) + toggler ficam na linha 1;
   o ul de sub-itens (width:100%) quebra automaticamente para linha 2. */
body.btMenuVertical .mainHeader .menuPort nav > ul > li {
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: flex-start !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
	padding: 0 !important;
}

body.btMenuVertical .mainHeader .menuPort nav > ul > li > a {
	flex: 1 !important;
	order: 2; /* texto à esquerda */
	min-width: 0;
	display: flex !important;
	align-items: center !important;
	min-height: 52px !important;
	line-height: 1.2 !important;
	padding: 14px 16px 14px 20px !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	letter-spacing: 0.08em !important;
	text-transform: uppercase !important;
	text-align: left !important;
	color: #fff !important;
	box-sizing: border-box;
}

/* Chevron nível 1: à direita, sempre alinhado com o texto */
body.btMenuVertical .mainHeader .menuPort nav > ul > li > .subToggler {
	order: 3; /* seta à direita */
	position: static !important;
	width: 52px;
	min-height: 52px;
	flex-shrink: 0;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	background: transparent !important;
	color: rgba(255, 255, 255, 0.5);
	font-size: 12px;
	transition: transform 0.15s ease;
	transform-origin: center;
	padding: 0 !important;
	line-height: 1;
	transform: none;
	cursor: pointer;
}

body.btMenuVertical .mainHeader .menuPort nav > ul > li > .subToggler:hover,
body.btMenuVertical .mainHeader .menuPort nav > ul > li > .subToggler:active,
body.btMenuVertical .mainHeader .menuPort nav > ul > li > .subToggler:focus {
	background: transparent !important;
	outline: none !important;
	box-shadow: none !important;
}

body.btMenuVertical .mainHeader .menuPort nav > ul > li.on > .subToggler {
	transform: rotate(180deg);
}

/* ── 11.5  Nível 2: sub-itens com borda secondary ── */
body.btMenuVertical .mainHeader .menuPort nav > ul > li > ul {
	order: 4; /* garante que o submenu fica ABAIXO do a+toggler (orders 2+3) */
	width: 100%; /* ocupa linha 2 do flex, abaixo de a+toggler */
	background: rgba(0, 0, 0, 0.20) !important;
	border-left: 3px solid #729ec4 !important;
	margin: 0 !important;
	padding: 0 !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	border-top: none !important;
}

/* li nível 2: mesma abordagem flex */
body.btMenuVertical .mainHeader .menuPort nav > ul > li > ul > li {
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: flex-start !important;
	background: transparent !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
	padding: 0 !important;
}

body.btMenuVertical .mainHeader .menuPort nav > ul > li > ul > li:last-child {
	border-bottom: none !important;
}

body.btMenuVertical .mainHeader .menuPort nav > ul > li > ul > li > a {
	flex: 1 !important;
	order: 2;
	min-width: 0;
	display: flex !important;
	align-items: center !important;
	min-height: 46px !important;
	line-height: 1.3 !important;
	padding: 12px 12px 12px 32px !important;
	font-size: 13px !important;
	font-weight: 400 !important;
	letter-spacing: 0.02em !important;
	text-transform: none !important;
	text-align: left !important;
	color: rgba(255, 255, 255, 0.88) !important;
	border-radius: 0 !important;
	box-sizing: border-box;
}

/* Chevron nível 2 */
body.btMenuVertical .mainHeader .menuPort nav > ul > li > ul > li > .subToggler {
	order: 3;
	position: static !important;
	width: 44px;
	min-height: 46px;
	flex-shrink: 0;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	background: transparent !important;
	color: rgba(255, 255, 255, 0.4);
	font-size: 11px;
	transition: transform 0.15s ease;
	transform-origin: center;
	padding: 0 !important;
	line-height: 1;
	transform: none;
	cursor: pointer;
}

body.btMenuVertical .mainHeader .menuPort nav > ul > li > ul > li > .subToggler:hover,
body.btMenuVertical .mainHeader .menuPort nav > ul > li > ul > li > .subToggler:active,
body.btMenuVertical .mainHeader .menuPort nav > ul > li > ul > li > .subToggler:focus {
	background: transparent !important;
	outline: none !important;
	box-shadow: none !important;
}

body.btMenuVertical .mainHeader .menuPort nav > ul > li > ul > li.on > .subToggler {
	transform: rotate(180deg);
}

/* ul nível 3 ocupa linha 2 do flex pai */
body.btMenuVertical .mainHeader .menuPort nav > ul > li > ul > li > ul {
	order: 4;
	width: 100%;
	background: rgba(0, 0, 0, 0.16) !important;
	border-left: 3px solid rgba(114, 158, 196, 0.38) !important;
	margin: 0 !important;
	padding: 0 !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	border-top: none !important;
}

body.btMenuVertical .mainHeader .menuPort nav > ul > li > ul > li > ul > li {
	background: transparent !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.04) !important;
	padding: 0 !important;
}

body.btMenuVertical .mainHeader .menuPort nav > ul > li > ul > li > ul > li > a {
	display: flex !important;
	align-items: center !important;
	min-height: 42px !important;
	line-height: 1.3 !important;
	padding: 10px 20px 10px 48px !important;
	font-size: 12px !important;
	font-weight: 400 !important;
	letter-spacing: 0.01em !important;
	text-transform: none !important;
	text-align: left !important;
	color: rgba(255, 255, 255, 0.70) !important;
	border-radius: 0 !important;
	box-sizing: border-box;
}

/* ── 11.7  CTAs: sticky no rodapé do scroll container ──
   position: sticky + bottom: 0 dentro do overflow-y: auto do menuPort
   garante que os CTAs fiquem sempre visíveis na parte inferior
   do drawer, independente do scroll da nav.                      */
body.btMenuVertical .audaxco-mobile-ctas {
	display: flex !important;
	flex-direction: column !important;
	align-items: stretch !important;
	margin-top: auto; /* empurra ao rodapé quando a nav é curta */
	position: sticky !important;
	bottom: 0 !important;
	background: #004991 !important;
	flex-shrink: 0;
	padding: 16px 20px 20px;
	gap: 10px;
	width: 100%;
	box-sizing: border-box;
	border-top: 1px solid rgba(255, 255, 255, 0.18);
	z-index: 2;
}

/* Re-habilita btIconWidget dentro dos CTAs (poderia ser ocultado por regras anteriores) */
body.btMenuVertical .mainHeader .menuPort .audaxco-mobile-ctas .btIconWidget {
	display: block !important;
}

/* ---------------------------------------------------------------
   13. LAYOUT SINGLE-ROW (horizontal-right / sem btMenuBelowLogo)
       .port = flex row: [logo] — [menuPort flex:1] — [topBarInLogoArea]
   --------------------------------------------------------------- */

/* menuPort cresce e empurra CTAs para a direita */
.btMenuHorizontal:not(.btMenuBelowLogo) .mainHeader .bt-logo-area .port .menuPort {
	flex: 1;
	display: flex;
	align-items: stretch;
	justify-content: flex-end;
}

/* nav e ul se expandem para preencher o menuPort */
.btMenuHorizontal:not(.btMenuBelowLogo) .mainHeader .menuPort nav,
.btMenuHorizontal:not(.btMenuBelowLogo) .mainHeader .menuPort nav > ul {
	display: flex;
	align-items: stretch;
}

/* linha-de-base dos itens = altura do header row (46 px)
   height explícito garante que o hover ::before/::after não use o logoHeight do css-override */
.btMenuHorizontal:not(.btMenuBelowLogo) .menuPort nav > ul > li > a,
.btMenuHorizontal:not(.btMenuBelowLogo) .menuPort nav > ul > li > .subToggler {
	line-height: 46px !important;
	height: 46px !important;
	box-sizing: border-box !important;
	white-space: nowrap;
}

/* dropdown posicionado abaixo do item */
.btMenuHorizontal:not(.btMenuBelowLogo) .menuPort > nav > ul > li > ul {
	top: 46px !important;
}

/* topBarInLogoArea: cancela height fixo do css-override.php (logoHeight) */
.btMenuHorizontal:not(.btMenuBelowLogo) .mainHeader .bt-logo-area .topBarInLogoArea {
	height: auto !important;
}

/* topBarInMenu (container do widget de busca): JS move o widget para
   topBarInLogoAreaCell; esconde o wrapper vazio antes do JS rodar */
.btMenuHorizontal:not(.btMenuBelowLogo) .mainHeader .topBarInMenu {
	display: none !important;
}

/* Sticky: altura reduzida */
.btStickyHeaderActive.btMenuHorizontal:not(.btMenuBelowLogo) .menuPort nav > ul > li > a,
.btStickyHeaderActive.btMenuHorizontal:not(.btMenuBelowLogo) .menuPort nav > ul > li > .subToggler {
	line-height: 40px !important;
}

.btStickyHeaderActive.btMenuHorizontal:not(.btMenuBelowLogo) .menuPort > nav > ul > li > ul {
	top: 40px !important;
}

/* ---------------------------------------------------------------
   14. ÍCONES-ONLY (≤ 1570px) — esconde labels, mantém só ícone
   --------------------------------------------------------------- */
@media (max-width: 1570px) {
	.topBarInLogoArea a.bt_button_widget .bt_bb_button_text,
	.topBarInLogoArea .audaxco-header-guide .audaxco-header-cta-label-full,
	.topBarInLogoArea .audaxco-header-guide .audaxco-header-cta-label-short {
		display: none !important;
	}

	.topBarInLogoArea a.bt_button_widget {
		width: 38px !important;
		min-width: 38px !important;
		padding: 0 !important;
		justify-content: center !important;
	}

	.topBarInLogoArea .audaxco-header-guide {
		width: 38px !important;
		min-width: 38px !important;
		padding: 0 !important;
		justify-content: center !important;
	}

	/* Remove margin do ícone (espaço entre icon e label) — só necessário com label visível */
	.topBarInLogoArea .bt_bb_icon_holder {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}
}

/* ---------------------------------------------------------------
   15. ANIMAÇÕES DO DRAWER MOBILE
   @version 1.0.0 (2026-04-22)
   --------------------------------------------------------------- */

/* ── 15.1  Slide-in da esquerda ──
   O tema posiciona .mainHeader fora da tela via left/right.
   Adicionamos transition para que a abertura seja suave.
   O translateX garante que, mesmo que o tema mude o left,
   o movimento seja sempre animado.                            */
body.btMenuVertical .mainHeader {
	transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1),
	            left 0.28s cubic-bezier(0.4, 0, 0.2, 1),
	            right 0.28s cubic-bezier(0.4, 0, 0.2, 1);
	padding-bottom: 0 !important; /* zera o padding-bottom injetado inline pelo tema */
}

/* ── 15.2  Accordion suave nos sub-menus ──
   O tema alterna a classe .on no <li> para abrir/fechar.
   max-height: 0 → um valor grande cobre qualquer submenu.   */
body.btMenuVertical .mainHeader .menuPort nav ul ul {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.28s ease-in-out;
}

body.btMenuVertical .mainHeader .menuPort nav li.on > ul {
	max-height: 1600px; /* cobre os maiores submenus (Categorias: 24 itens ~1100px); 800px cortava em "Limpa Vidros" */
	transition: max-height 0.35s ease-in-out;
}
