/* header-fix.css — correções do cabeçalho aplicáveis a QUALQUER página do site,
   inclusive as de produto, que não carregam o global.css (usam <style> inline).

   Bugs corrigidos:
   · wordmark quebrando em 2–3 linhas dentro da barra de 64px
   · .navbar-actions com flex-grow esticando e colapsando o logo
   · botão de menu (hambúrguer) saindo da tela no celular
*/

/* Wordmark em uma linha, sempre dentro da barra */
.navbar-logo, .g-nav-logo { flex: 1 1 auto; min-width: 0; text-decoration: none; }
.logo-main, .g-nav-logo .l1 {
  white-space: nowrap;
  font-size: 17px;
  letter-spacing: .06em;
  line-height: 1.1;
  overflow: hidden;
  text-overflow: ellipsis;
}
.logo-sub, .g-nav-logo .l2 {
  white-space: nowrap;
  font-size: 8.5px;
  letter-spacing: .18em;
  line-height: 1.2;
  margin-top: 1px;
}

/* Links do menu nunca quebram */
.navbar-nav > a, .g-nav-links > a {
  white-space: nowrap;
  line-height: 1;
  display: inline-flex;
  align-items: center;
}
.navbar-nav, .g-nav-links { flex-wrap: nowrap; gap: 4px; }

/* Barra: alinhamento previsível, largura travada, ações pelo conteúdo */
.navbar, .g-nav { max-width: 100%; }
.navbar-container, .navbar-inner, .g-nav-inner {
  align-items: center;
  justify-content: space-between;
  min-height: 64px;
  gap: 16px;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}
.navbar-actions { flex: 0 0 auto !important; width: auto !important; gap: 6px; }

/* Telas médias: encolhe antes de quebrar */
@media (max-width: 1180px) and (min-width: 981px) {
  .navbar-nav > a, .g-nav-links > a { font-size: .82rem; padding-left: 9px; padding-right: 9px; }
  .navbar-container, .navbar-inner, .g-nav-inner { gap: 12px; }
}

/* Celular: subtítulo some, alvos de toque garantidos, nada sai da tela */
@media (max-width: 720px) {
  .logo-sub, .g-nav-logo .l2 { display: none; }
  .logo-main, .g-nav-logo .l1 { font-size: 15px; letter-spacing: .015em; }
  .navbar-container, .navbar-inner, .g-nav-inner { gap: 8px; padding-left: 16px; padding-right: 16px; }
  .navbar-actions { gap: 2px; margin-left: auto; max-width: 62vw; }
  .navbar-actions > * { margin-left: 1px !important; margin-right: 1px !important; }
  .psy-cart-link, .psy-user-area a, .nav-toggler, .g-nav-toggle { width: 38px !important; height: 38px !important; }
  .btn-nav-wa .wa-label { display: none; }
  .btn-nav-wa { width: 38px; height: 38px; padding: 0; justify-content: center; }
  .btn-nav-wa svg { width: 19px; height: 19px; }
  .psy-user-area .psy-user-text { display: none; }
}
@media (max-width: 360px) {
  .logo-main, .g-nav-logo .l1 { font-size: 13.5px; letter-spacing: 0; }
}

/* Nenhuma página rola na horizontal */
html, body { overflow-x: clip; }

/* Páginas de produto: logo e ações do header injetado */
.navbar-inner { align-items:center; justify-content:space-between; gap:16px; width:100%; max-width:1200px; box-sizing:border-box; }
.navbar-inner .navbar-logo { flex:1 1 auto; min-width:0; }
.navbar-inner > .psy-cart-link,
.navbar-inner > .psy-user-area { flex:0 0 auto; }
@media (max-width:720px){
  .navbar-inner { gap:6px; padding-left:16px; padding-right:16px; }
}

/* Rede de segurança do reveal: elemento já revelado NUNCA fica invisível.
   Incidente 29/07 — /produtos renderizava em branco. */
.rvl.in, .fade-up.visible { opacity: 1 !important; transform: none !important; }
