/* Cabeçalho semântico (header/nav) com Flexbox, sem tabelas.
   Logo + busca + ícones ficam juntos numa faixa; o menu de navegação
   continua numa linha própria logo abaixo. */
.hf-header { background:#EDF2F2; }
.hf-topbar { max-width:1024px; box-sizing:border-box; margin:0 auto; display:flex; align-items:center; gap:18px; padding:20px 15px 14px; flex-wrap:wrap; }
.hf-logo { flex-shrink:0; }
.hf-logo img, .hf-logo svg { display:block; }
.hf-search { position:relative; flex:1 1 200px; min-width:160px; }
.hf-search form { display:flex; }
.hf-search-box { display:flex; align-items:stretch; width:100%; max-width:420px; margin:0 auto; border:1px solid #D2DADD; border-radius:8px; overflow:hidden; background:#F7F9FA; box-sizing:border-box; }
.hf-search-box input { flex:1; min-width:0; border:none; background:transparent; padding:0 16px; height:44px; color:#757575; font-size:14px; outline:none; }
.hf-search-box button { width:44px; border:none; border-left:1px solid #D2DADD; background:#F7F9FA; cursor:pointer; display:flex; align-items:center; justify-content:center; padding:0; flex-shrink:0; }
.hf-suggest { position:absolute; top:100%; left:0; right:0; max-width:420px; margin:6px auto 0; background:#FFFFFF; border:1px solid #E1E8EA; border-radius:6px; box-shadow:0 1px 2px rgba(22,35,44,0.05), 0 6px 20px rgba(22,35,44,0.06); max-height:360px; overflow-y:auto; z-index:1000; font-family:Arial, Helvetica, sans-serif; }
.hf-suggest[hidden] { display:none; }
.hf-suggest a { display:flex; align-items:center; gap:10px; padding:8px 12px; text-decoration:none; color:#16232C; }
.hf-suggest a:hover, .hf-suggest a.ativo { background:#EDF2F2; }
.hf-suggest img { width:32px; height:44px; object-fit:contain; background:#F5F8F9; border-radius:4px; flex-shrink:0; }
.hf-suggest-info { min-width:0; }
.hf-suggest-titulo { display:block; font-size:13px; font-weight:bold; line-height:1.3; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.hf-suggest-autor { display:block; font-size:11px; color:#5B6B72; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.hf-suggest.hf-suggest-vazio { position:static; background:none; border:none; box-shadow:none; margin:4px auto 14px; }
.hf-suggest-empty { padding:0; font-size:12px; color:#C0392B; font-weight:bold; text-align:left; }
.hf-suggest-empty a { display:inline; padding:0; color:#C0392B; text-decoration:underline; }
.hf-icons { display:flex; align-items:center; gap:8px; flex-wrap:wrap; flex-shrink:0; }
/* :not(.hf-account-menu ...)/:not(.hf-cart-menu ...) evita que este reset
   genérico dos ícones do topo vaze pros links/botões de dentro dos menus
   suspensos de conta/carrinho (que têm sua própria aparência definida mais
   abaixo). */
.hf-icons a:not(.hf-account-menu a):not(.hf-cart-menu a), .hf-icons button:not(.hf-account-menu button):not(.hf-cart-menu button) { display:flex; align-items:center; justify-content:center; background:none; text-decoration:none; padding:8px; border-radius:4px; border:none; cursor:pointer; }
.hf-icons a:hover:not(.hf-account-menu a):not(.hf-cart-menu a), .hf-icons button:hover:not(.hf-account-menu button):not(.hf-cart-menu button) { background:#DCE4E6; }
.hf-icons svg:not(.hf-account-menu svg):not(.hf-cart-menu svg) { width:32px; height:33px; display:block; }

.hf-icons .hf-account-logado { flex-direction:column; gap:1px; padding:6px 8px; }
.hf-account-nome { font-family:Arial, Helvetica, sans-serif; font-size:10px; color:#16232C; line-height:1; max-width:72px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.hf-account-wrap { position:relative; }
.hf-account-menu { position:absolute; top:100%; right:0; margin-top:8px; background:#ffffff; border:1.5px solid #C7D2D6; border-radius:8px; box-shadow:0 4px 12px rgba(22,35,44,0.14), 0 12px 32px rgba(22,35,44,0.12); padding:18px; width:280px; box-sizing:border-box; z-index:1000; font-family:Arial, Helvetica, sans-serif; }
.hf-account-menu[hidden] { display:none; }
.hf-account-menu-nome { margin:0 0 2px; font-size:15px; font-weight:bold; color:#16232C; }
.hf-account-menu-email { margin:0 0 14px; font-size:12px; color:#5B6B72; word-break:break-all; }
.hf-account-menu-link { display:block; padding:9px 0; font-size:13px; font-weight:bold; color:#16232C; text-decoration:none; }
.hf-account-menu-link:hover { color:#006486; }
.hf-account-menu-sair { color:#C0392B; }
.hf-account-menu-sair:hover { color:#A5311F; }
.hf-login-title { margin:0 0 14px; font-size:15px; font-weight:bold; color:#16232C; }
.hf-login-google-btn { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; box-sizing:border-box; background:#fff; color:#16232C; border:1px solid #E1E8EA; border-radius:8px; padding:9px; font-size:13px; font-weight:bold; text-decoration:none; margin-bottom:12px; }
.hf-login-google-btn:hover { background:#F7FAFA; border-color:#006486; }
.hf-login-divider { display:flex; align-items:center; gap:8px; margin:0 0 12px; font-size:11px; color:#8B9BA1; }
.hf-login-divider::before, .hf-login-divider::after { content:""; flex:1; height:1px; background:#E1E8EA; }
.hf-login-field { margin-bottom:12px; }
.hf-login-field label { display:block; font-size:12px; color:#16232C; margin-bottom:5px; }
.hf-login-input { width:100%; box-sizing:border-box; border:1px solid #E1E8EA; border-radius:8px; padding:9px 10px; font-size:13px; font-family:Arial, Helvetica, sans-serif; color:#16232C; }
.hf-login-input:focus { outline:2px solid #006486; outline-offset:1px; }
.hf-login-hint { font-size:11px; margin:0 0 12px; text-align:right; }
.hf-login-hint a { color:#006486; }
.hf-login-submit { display:block; width:100%; text-align:center; background:#006486; color:#fff; border:none; border-radius:8px; padding:11px; font-size:14px; font-weight:bold; cursor:pointer; font-family:Arial, Helvetica, sans-serif; }
.hf-login-submit:hover { background:#004357; }
.hf-login-hr { border:none; border-top:1px solid #E1E8EA; margin:16px 0; }
.hf-login-cadastro-label { margin:0 0 10px; font-size:12px; color:#5B6B72; text-align:center; }
.hf-login-cadastro-btn { display:block; width:100%; box-sizing:border-box; text-align:center; background:#EDF2F2; color:#006486; border:1px solid #C7D2D6; border-radius:8px; padding:10px; font-size:13px; font-weight:bold; text-decoration:none; }
.hf-login-cadastro-btn:hover { background:#DCE4E6; }

.hf-cart-wrap { position:relative; }
.hf-cart-toggle { position:relative; }
.hf-cart-badge { position:absolute; top:2px; right:2px; min-width:16px; height:16px; padding:0 3px; border-radius:999px; background:#FF8A00; color:#fff; font-family:Arial, Helvetica, sans-serif; font-size:10px; font-weight:bold; line-height:16px; text-align:center; box-sizing:border-box; }
.hf-cart-menu { position:absolute; top:100%; right:0; margin-top:8px; background:#ffffff; border:1.5px solid #C7D2D6; border-radius:8px; box-shadow:0 4px 12px rgba(22,35,44,0.14), 0 12px 32px rgba(22,35,44,0.12); padding:16px; width:320px; box-sizing:border-box; z-index:1000; font-family:Arial, Helvetica, sans-serif; }
.hf-cart-menu[hidden] { display:none; }
.hf-cart-items { display:flex; flex-direction:column; gap:12px; max-height:320px; overflow-y:auto; margin-bottom:14px; }
.hf-cart-item { display:grid; grid-template-columns:40px 1fr auto auto; gap:10px; align-items:center; }
.hf-cart-item-cover { display:block; flex-shrink:0; }
.hf-cart-item-cover img { display:block; width:40px; height:auto; border-radius:3px; }
.hf-cart-item-info { display:flex; flex-direction:column; gap:2px; min-width:0; }
.hf-cart-item-title { font-size:12px; font-weight:bold; color:#16232C; text-decoration:none; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.hf-cart-item-title:hover { color:#006486; }
.hf-cart-item-qty { font-size:11px; color:#5B6B72; }
.hf-cart-item-subtotal { font-size:12px; font-weight:bold; color:#16232C; white-space:nowrap; }
.hf-cart-item-remove { background:none; border:none; padding:4px; margin:0; cursor:pointer; color:#8B9BA1; display:flex; align-items:center; justify-content:center; }
.hf-cart-item-remove:hover { color:#C0392B; }
.hf-cart-total { display:flex; justify-content:space-between; align-items:center; font-size:13px; font-weight:bold; color:#16232C; padding-top:12px; border-top:1px solid #E1E8EA; margin-bottom:14px; }
.hf-cart-checkout-btn { display:block; width:100%; box-sizing:border-box; text-align:center; background:#006486; color:#fff; border:none; border-radius:10px; padding:12px; font-size:14px; font-weight:bold; text-decoration:none; }
.hf-cart-checkout-btn:hover { background:#004357; }
.hf-cart-empty { margin:0 0 14px; font-size:13px; color:#5B6B72; text-align:center; }
.hf-cart-close-btn { display:block; width:100%; box-sizing:border-box; text-align:center; background:#EDF2F2; color:#16232C; border:1px solid #C7D2D6; border-radius:8px; padding:10px; font-size:13px; font-weight:bold; cursor:pointer; }
.hf-cart-close-btn:hover { background:#DCE4E6; }

@media (hover:hover) and (pointer:fine) {
	/* "ponte" invisível cobrindo o espaço entre cada ícone e seu menu (mesmo
	   tamanho/posição do margin-top de cada menu) -- sem ela, o cursor perde
	   o hover no trajeto e o menu fecha antes de ser alcançado. */
	.hf-account-wrap::after { content:""; position:absolute; top:100%; right:0; width:280px; height:8px; }
	.hf-cart-wrap::after { content:""; position:absolute; top:100%; right:0; width:320px; height:8px; }
	.hf-account-wrap:hover .hf-account-menu, .hf-cart-wrap:hover .hf-cart-menu { display:block !important; }
}
@media (max-width:480px) {
	.hf-account-menu, .hf-cart-menu { position:fixed; top:auto; right:15px; left:15px; width:auto; }
}
.hf-nav { max-width:1024px; box-sizing:border-box; margin:0 auto; padding:2px 15px 8px; display:flex; flex-wrap:wrap; justify-content:center; align-items:baseline; gap:10px; }
.hf-nav a { text-decoration:none; font-family:Arial, Helvetica, sans-serif; font-size:14px; font-weight:bold; color:#16232C; white-space:nowrap; }
.hf-nav a:hover { color:#006486; }
.hf-nav-sep { color:#9AA5AA; font-size:14px; }
.hf-bar { height:1px; background:#006486; }
.hf-nav-item { position:relative; display:inline-flex; align-items:center; gap:3px; }
.hf-nav-caret { border:none; background:none; padding:4px 2px; margin:0; cursor:pointer; color:#5B6B72; display:inline-flex; align-items:center; -webkit-appearance:none; appearance:none; }
.hf-nav-caret:hover, .hf-nav-caret[aria-expanded="true"] { color:#006486; }
.hf-nav-drop { position:absolute; top:100%; left:50%; transform:translateX(-50%); margin-top:8px; background:#ffffff; border:1.5px solid #C7D2D6; border-radius:8px; box-shadow:0 4px 12px rgba(22,35,44,0.14), 0 12px 32px rgba(22,35,44,0.12); padding:8px; min-width:210px; max-width:min(280px, 90vw); z-index:1000; display:flex; flex-direction:column; }
.hf-nav-drop[hidden] { display:none; }
.hf-nav-drop a { padding:8px 10px; color:#16232C; font-family:Arial, Helvetica, sans-serif; font-size:13px; font-weight:bold; text-decoration:none; border-radius:5px; white-space:nowrap; }
.hf-nav-drop a:hover { background:#EDF2F2; color:#006486; }
/* Categoria terciária (3º nível, "modelo Manning"): abre num flyout à direita
   da subcategoria, não embaixo -- só existe hoje o mecanismo, nenhuma
   subcategoria ainda tem filhas (ver menutopo.inc). Só desktop de propósito
   (regra no fim do arquivo esconde em telas pequenas). */
.hf-nav-item2 { position:relative; display:flex; align-items:center; }
.hf-nav-item2 > a { flex:1; }
.hf-nav-caret2 { border:none; background:none; padding:4px 10px 4px 4px; margin:0; cursor:pointer; color:#9AA5AA; display:inline-flex; align-items:center; flex-shrink:0; -webkit-appearance:none; appearance:none; }
.hf-nav-caret2:hover, .hf-nav-caret2[aria-expanded="true"] { color:#006486; }
.hf-nav-drop2 { position:absolute; top:-8px; left:100%; margin-left:6px; background:#ffffff; border:1.5px solid #C7D2D6; border-radius:8px; box-shadow:0 4px 12px rgba(22,35,44,0.14), 0 12px 32px rgba(22,35,44,0.12); padding:8px; min-width:200px; max-width:min(260px, 90vw); z-index:1001; display:flex; flex-direction:column; }
.hf-nav-drop2[hidden] { display:none; }
.hf-nav-drop2 a { padding:8px 10px; color:#16232C; font-family:Arial, Helvetica, sans-serif; font-size:13px; font-weight:bold; text-decoration:none; border-radius:5px; white-space:nowrap; }
.hf-nav-drop2 a:hover { background:#EDF2F2; color:#006486; }
@media (max-width:600px) {
	.hf-nav { flex-wrap:nowrap; justify-content:flex-start; overflow-x:auto; -webkit-overflow-scrolling:touch; }
	.hf-nav-drop { position:fixed; top:auto; left:15px; right:15px; transform:none; max-width:none; }
	.hf-nav-caret2 { display:none; }
	.hf-nav-drop2 { display:none !important; }
}
@media (max-width:600px) {
	.hf-topbar { padding:16px 15px 10px; gap:10px; }
	.hf-logo { order:1; }
	.hf-icons { order:2; gap:4px; margin-left:auto; }
	.hf-search { order:3; flex-basis:100%; min-width:0; margin-top:12px; }
	.hf-search-box { max-width:100%; }
}
@media (max-width:480px) {
	.hf-icons a:not(.hf-account-menu a):not(.hf-cart-menu a), .hf-icons button:not(.hf-account-menu button):not(.hf-cart-menu button) { padding:6px; }
	.hf-icons svg:not(.hf-account-menu svg):not(.hf-cart-menu svg) { width:26px; height:27px; }
}

/* Compatibilidade: páginas ainda não convertidas para HTML semântico usam
   estas classes no wrapper de tabela do próprio conteúdo. Remover quando
   todas as páginas estiverem migradas para <main>. */
.site-wrap { max-width: 1024px; width: 100%; margin-left: auto; margin-right: auto; box-sizing: border-box; }
@media (max-width: 768px) {
	.main-content table tr:has(> td + td) > td {
		display: block;
		width: 100% !important;
		height: auto !important;
	}
	.main-content img:not([width]) {
		max-width: 100%;
		height: auto;
	}
}
