/**
 * Cabeçalho do site — menu de categorias do ERP e sugestões da busca.
 * (cabecalho.js preenche os dois a partir da REST API do site.)
 */

/* ── Menu "Todas as categorias" ─────────────────────────── */
.sv-dropdown-menu.svp-menu-erp { min-width: 300px; }
.sv-dropdown-menu.svp-menu-erp a { font-size: 13px; }
.svp-menu-nome { flex: 1; }
.svp-menu-qtd { font-style: normal; font-size: 12px; color: #999; }
.sv-dropdown-menu.svp-menu-erp a.svp-menu-todas {
	margin-top: 6px;
	border-top: 1px solid #eee;
	color: var(--sv-red, #d20a11) !important;
	font-weight: 700;
}

/* ── Sugestões da busca ─────────────────────────────────── */
.svp-sug {
	position: absolute;
	top: calc(100% + 4px);
	left: 0;
	right: 0;
	z-index: 9500;
	max-height: min(70vh, 540px);
	overflow-y: auto;
	background: #fff;
	border: 1px solid #e5e5e5;
	box-shadow: 0 12px 32px rgba(0, 0, 0, .15);
	font-family: 'Open Sans', sans-serif;
	text-align: left;
}
.svp-sug[hidden] { display: none; }
.svp-sug-titulo {
	padding: 12px 16px 6px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: #999;
}
.svp-sug-cats { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 16px 8px; }
.svp-sug a { text-decoration: none; }
.svp-sug-cat {
	padding: 5px 10px;
	font-size: 12px;
	color: #333 !important;
	background: #f5f5f5;
	border: 1px solid transparent;
}
.svp-sug-cat em { margin-left: 6px; font-style: normal; color: #999; }
.svp-sug-prod {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 8px 16px;
	color: #222 !important;
}
.svp-sug-img {
	flex: none;
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	background: #f5f5f5;
	border: 1px solid #eee;
}
.svp-sug-img img { width: 100%; height: 100%; object-fit: contain; background: #fff; }
.svp-sug-txt { min-width: 0; display: flex; flex-direction: column; }
.svp-sug-txt strong { font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.svp-sug-txt small { font-size: 11.5px; color: #888; }
.svp-sug-todos {
	display: block;
	padding: 12px 16px;
	border-top: 1px solid #eee;
	font-size: 13px;
	font-weight: 700;
	color: var(--sv-red, #d20a11) !important;
}
.svp-sug-vazio { padding: 16px; font-size: 13px; color: #888; }
.svp-sug-prod.svp-ativo, .svp-sug-prod:hover,
.svp-sug-todos.svp-ativo, .svp-sug-todos:hover { background: #fdf0f0; }
.svp-sug-cat.svp-ativo, .svp-sug-cat:hover { background: #fff; border-color: var(--sv-red, #d20a11); }