/* =====================================================================
   CJC Imóveis — Idiomas
   O seletor no cabeçalho e os ajustes que qualquer página no idioma
   precisa (fontes CJK, aviso de tradução).
   ===================================================================== */

/* ---------- Seletor ---------- */
.idiomas { position: relative; }
.idiomas summary {
  list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 6px;
  height: 40px; padding: 0 12px; border-radius: var(--r-pill);
  border: 1px solid rgba(255, 255, 255, .28); color: #fff;
  font-size: 12.5px; font-weight: 650; letter-spacing: .04em; transition: .2s var(--ease);
}
.idiomas summary::-webkit-details-marker { display: none; }
.header.solid .idiomas summary { border-color: var(--line-strong); color: var(--ink); }
.idiomas summary:hover { border-color: currentColor; }
.idiomas[open] summary svg { transform: rotate(180deg); }
.idiomas summary svg { transition: transform .2s var(--ease); }
.idiomas ul {
  position: absolute; right: 0; top: calc(100% + 8px); z-index: 120; min-width: 168px;
  margin: 0; padding: 6px; list-style: none;
  background: #fff; color: var(--ink); border: 1px solid var(--line); border-radius: var(--r-md);
  box-shadow: var(--shadow-md);
}
.idiomas li a {
  display: block; padding: 9px 12px; border-radius: 10px; font-size: 14px; font-weight: 500;
  color: inherit; text-decoration: none;
}
.idiomas li a:hover { background: var(--paper); }
.idiomas li.ativo a { font-weight: 700; }
.idiomas li.ativo a::after { content: "✓"; float: right; color: var(--muted); }

/* No rodapé o seletor é uma linha simples. */
.footer .idiomas-rodape { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 18px; font-size: 13px; }
.footer .idiomas-rodape a { color: #9a9993; text-decoration: none; }
.footer .idiomas-rodape a:hover, .footer .idiomas-rodape a.ativo { color: #fff; }

/* No menu do celular. */
.mobile-menu .idiomas-rodape { display: flex; flex-wrap: wrap; gap: 8px 16px; margin: 0 0 18px; font-size: 14px; }
.mobile-menu .idiomas-rodape a { color: rgba(255, 255, 255, .7); text-decoration: none; }
.mobile-menu .idiomas-rodape a.ativo { color: #fff; font-weight: 700; }

/* ---------- Tipografia por escrita ---------- */
body.lang-ja { --font: "Inter", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Yu Gothic", Meiryo, sans-serif; }
body.lang-zh { --font: "Inter", "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", "Microsoft YaHei", sans-serif; }
body.lang-ja, body.lang-zh { letter-spacing: 0; }
body.lang-ja h1, body.lang-ja h2, body.lang-ja h3, body.lang-zh h1, body.lang-zh h2, body.lang-zh h3 { letter-spacing: -.01em !important; line-height: 1.25 !important; }
body.lang-ru h1, body.lang-ru h2 { letter-spacing: -.03em; }

/* ---------- Aviso de tradução automática (rodapé) ---------- */
.aviso-traducao { font-size: 12px; color: #8b8a84; max-width: 72ch; line-height: 1.6; margin: 14px 0 0; }

@media (max-width: 900px) {
  .header .idiomas { display: none; }
}

/* Câmbio aproximado ao lado do preço (só em idioma, só com a opção ligada). */
.cambio { display: inline-block; margin-left: .45em; font-size: .62em; font-weight: 500; letter-spacing: 0; color: var(--muted); white-space: nowrap; vertical-align: baseline; cursor: help; }
.price .cambio, .prop-price .cambio { font-size: .55em; }
.summary b .cambio, .resumo-lateral b .cambio { display: block; margin: 2px 0 0; font-size: 11.5px; }
