/* Seletor de idioma (dropdown com bandeiras) — baseado em SELETOR-DE-IDIOMA.md, com as cores da Croquito (tema claro) */
:root {
  --lang-border-soft: #d9d4b8;
  --lang-bg-soft: #eae6cf;
  --lang-text: #3a2412;
  --lang-muted: #715035;
  --lang-surface: #f8f5e8;
  --lang-surface-hover: #e4dfc4;
  --lang-border: #cfcaa8;
  --lang-accent: #c8641d;
}

.lang-switch { position: relative; flex: 0 0 auto; font-family: "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif; }

.lang-switch__trigger {
  display: flex; align-items: center; gap: 8px;
  height: 40px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid var(--lang-border-soft);
  background: var(--lang-bg-soft);
  font-family: inherit;
  font-size: 13px; font-weight: 600; color: var(--lang-text);
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease;
}
.lang-switch__trigger:hover { background: var(--lang-surface-hover); border-color: var(--lang-border); }
.lang-switch__trigger:focus-visible,
.lang-switch__option:focus-visible { outline: 3px solid var(--lang-accent); outline-offset: 2px; }

.lang-switch__flag {
  width: 18px; height: 13px; border-radius: 2px; object-fit: cover; flex: 0 0 auto;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, .12); /* tema claro: contorno escuro discreto */
}

.lang-switch__chevron { flex: 0 0 auto; color: var(--lang-muted); transition: transform .25s ease; }
.lang-switch.is-open .lang-switch__chevron { transform: rotate(180deg); }

.lang-switch__menu {
  position: absolute; top: 100%; right: 0; margin-top: 8px;
  min-width: 150px;
  background: var(--lang-surface); border: 1px solid var(--lang-border); border-radius: 12px;
  box-shadow: 0 24px 48px rgba(58, 36, 18, .14);
  padding: 6px;
  opacity: 0; visibility: hidden; transform: translateY(8px);
  transition: opacity .25s ease, transform .25s ease, visibility 0s linear .25s;
  z-index: 95;
}
.lang-switch.is-open .lang-switch__menu {
  opacity: 1; visibility: visible; transform: translateY(0);
  transition: opacity .25s ease, transform .25s ease, visibility 0s linear 0s;
}

.lang-switch__option {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 10px; border-radius: 8px;
  font-size: 14px; font-weight: 500; color: var(--lang-text);
  text-decoration: none;
  transition: background .2s ease;
}
.lang-switch__option:hover { background: var(--lang-bg-soft); }
.lang-switch__option.is-active { color: var(--lang-accent); font-weight: 600; }
.lang-switch__option-flag { width: 18px; height: 13px; border-radius: 2px; object-fit: cover; flex: 0 0 auto; box-shadow: 0 0 0 1px rgba(0, 0, 0, .12); }

/* Posição dentro do cabeçalho do site (injetado por i18n.js) */
/* alinhado à largura do conteúdo (1440px centrado, 32px de margem), como o logótipo */
.lang-switch--header { position: absolute; right: max(32px, calc(50% - 688px)); top: 29px; z-index: 96; }

/* Tablet: o botão do menu (hambúrguer) ocupa o canto direito; o seletor fica ao lado dele */
@media (max-width: 1199.98px) {
  .lang-switch--header { right: 76px; }
}

/* Mobile: trigger mais pequeno, à esquerda do botão do menu */
@media (max-width: 809.98px) {
  .lang-switch--header { right: 76px; top: 33px; }
  .lang-switch__trigger { height: 36px; padding: 0 10px; font-size: 12px; }
}

/* Telemóveis estreitos: só bandeira + seta, para não tapar o logótipo */
@media (max-width: 480px) {
  .lang-switch--header { right: 70px; }
  .lang-switch--header .lang-switch__current { display: none; }
  .lang-switch--header .lang-switch__trigger { padding: 0 9px; gap: 6px; }
}

/* Páginas legais: seletor no topo, alinhado à direita junto ao botão de voltar */
.lang-switch--page { display: inline-block; }

@media (prefers-reduced-motion: reduce) {
  .lang-switch__trigger, .lang-switch__chevron, .lang-switch__menu, .lang-switch__option { transition: none; }
}

/* EN: evita mostrar texto em PT enquanto o site hidrata e é traduzido */
html[data-lang="en"]:not(.i18n-ready) #main { opacity: 0; }
html[data-lang="en"] #main { transition: opacity .15s ease; }