/* =====================================================================
   bw-lang — seletor de idioma byworksy.com  (PT | ES | EN)
   Tema: GeneratePress 3.6 + GP Premium (menu-plus/offside)
   Autor: Company Designer / JobHolding — card t_c4f31237
   Este arquivo é o CSS definitivo: pode ir para o Customizer
   (Aparência › Personalizar › CSS adicional) sem plugin de UI.
   ===================================================================== */

/* ---------- tokens ---------------------------------------------------- */
:root {
  --bw-lang-ink:    #000000; /* ativo               — 21,0:1 em #fff */
  --bw-lang-mute:   #585858; /* inativo             —  7,1:1 em #fff */
  --bw-lang-hover:  #0b7a33; /* hover/foco (texto)  —  5,5:1 em #fff */
  --bw-lang-rule:   #0f9f44; /* indicador do ativo  —  3,5:1 (não-texto) */
  --bw-lang-sep:    #b3b3b3; /* divisor decorativo  —  aria-hidden      */
  --bw-lang-fs:     12px;    /* desktop               */
  --bw-lang-fs-sm:  13px;    /* slideout              */
}

/* ---------- estrutura comum ------------------------------------------ */
.bw-lang {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .7px;
  font-size: var(--bw-lang-fs);
  line-height: 1;
  white-space: nowrap;
}

.bw-lang__item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 26px;
  height: 30px;
  padding: 0 4px;
  color: var(--bw-lang-mute);
  text-decoration: none;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  box-shadow: inset 0 -2px 0 transparent;
  transition: color .12s linear, box-shadow .12s linear;
}

.bw-lang__item:hover,
.bw-lang__item:focus-visible { color: var(--bw-lang-hover); }

/* foco visível: anel de 2px + halo, nunca depende só de cor */
.bw-lang__item:focus-visible {
  outline: 2px solid var(--bw-lang-hover);
  outline-offset: 2px;
  border-radius: 2px;
}

/* idioma atual: <span> sem link, sublinhado verde de 2px (sem deslocar layout) */
.bw-lang__item.is-active,
.bw-lang__item[aria-current="true"] {
  color: var(--bw-lang-ink);
  box-shadow: inset 0 -2px 0 var(--bw-lang-rule);
  cursor: default;
}

/* divisor "|" desenhado em CSS (o caractere não é lido pelo leitor de tela) */
.bw-lang__sep {
  width: 1px;
  height: 13px;
  background: var(--bw-lang-sep);
  margin: 0 1px;
  flex: 0 0 auto;
}

/* =====================================================================
   1) HEADER (desktop) — entra por generate_after_primary_menu (prio 20)
      Posição: último filho de .inside-navigation, alinhado à direita.
   ===================================================================== */
@media (min-width: 1280px) {
  #site-navigation .inside-navigation { flex-wrap: nowrap; }

  #site-navigation .bw-lang--header {
    order: 5;
    margin-left: 8px;
    margin-right: 0;
  }

  /* =================================================================
     ESPAÇAMENTO DO MENU — card t_46522670 (v1.2.0)
     O "menu compacto" de 1.0.0 (padding 4px + letter-spacing .4px)
     fazia o seletor caber, mas deixava só 8px entre rótulos: o menu
     parecia colado. Novo cálculo medido no DOM (1280px, PT — o idioma
     mais largo dos três; ES 878 e EN 642 de soma de itens):

       linha disponível (header 1200 − logo 170) ......... 1030,0px
       seletor (90,4) + margem (8) + barra do menu (33) ... 131,4px
       → sobra para o menu ................................ 898,6px

       menu sem tracking (6 itens a 13px/700) ............. 851,2px
       + padding 8px nos dois lados dos 6 itens (+48) ..... 899,2px  ✗ 0,6px estoura,
       + padding 8px sem os 2 externos (4px no 1º e no
         último item: não contam para o espaço ENTRE eles)  891,2px  ✅ 7,4px de folga

     Resultado: 16px entre TODOS os rótulos (alvo mínimo do dono),
     zero quebra de linha, seletor intocado e sem overflow.
     10px exigiria +12px e derrubaria o 6º item para a 2ª linha —
     decisão registrada: 8px (o dono pediu: se faltar, manter 8px).
     ================================================================= */
  #site-navigation .main-nav > ul > li > a {
    padding-left: 8px;
    padding-right: 8px;
    letter-spacing: 0;
  }
  #site-navigation .main-nav > ul > li:first-child > a { padding-left: 4px; }
  #site-navigation .main-nav > ul > li:last-child > a { padding-right: 4px; }

  /* dropdowns ("Institucional") seguem compactos como estavam:
     o antigo `ul li a` também os atingia; aqui isso é preservado. */
  #site-navigation .main-nav ul ul a,
  #site-navigation .main-nav .sub-menu a {
    padding-left: 4px;
    padding-right: 4px;
    letter-spacing: .4px;
  }
}

/* abaixo de 1280px o header NÃO mostra o seletor (vai para o slideout) */
@media (max-width: 1279px) {
  .bw-lang--header { display: none !important; }
}

/* =====================================================================
   2) SLIDEOUT (mobile) — entra por wp_nav_menu_items em theme_location=slideout
      Marcado como último <li class="bw-lang-item"> do menu off-canvas.
   ===================================================================== */
#generate-slideout-menu .bw-lang-item,
.slideout-navigation .bw-lang-item {
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

#generate-slideout-menu .bw-lang,
.slideout-navigation .bw-lang {
  width: 100%;
  box-sizing: border-box;
  justify-content: flex-start;
  margin: 12px 0 0;
  padding: 14px 16px 10px;
  border-top: 1px solid #ececec;
  font-size: var(--bw-lang-fs-sm);
  letter-spacing: .8px;
}

/* alvo de toque ≥44×44 (WCAG 2.5.5) */
#generate-slideout-menu .bw-lang .bw-lang__item,
.slideout-navigation .bw-lang .bw-lang__item {
  min-width: 44px;
  height: 44px;
  min-height: 44px;
  padding: 0 10px;
  font-size: var(--bw-lang-fs-sm);
  letter-spacing: inherit;
  line-height: 1;
}

#generate-slideout-menu .bw-lang .bw-lang__sep,
.slideout-navigation .bw-lang .bw-lang__sep {
  height: 18px;
  margin: 0 2px;
}

/* respeita quem reduziu animação */
@media (prefers-reduced-motion: reduce) {
  .bw-lang__item { transition: none; }
}