/* EBON — language switcher. Scoped under .lang-*, no page-style side effects. */

.lang-switch{position:relative;flex:none}
.lang-btn{
  display:inline-flex;align-items:center;gap:6px;background:none;border:0;cursor:pointer;
  font:inherit;font-size:.82rem;color:var(--ink-2,#3b4650);padding:8px 4px;letter-spacing:.02em;
  border-radius:3px;transition:color .15s ease;
}
.lang-btn:hover,.lang-switch.open .lang-btn{color:var(--ink,#14181c)}
.lang-btn:focus-visible{outline:2px solid var(--accent,#8a5f2f);outline-offset:2px}
.lang-btn .globe{width:15px;height:15px;flex:none;opacity:.75}
.lang-btn .chev{width:10px;height:10px;flex:none;opacity:.55;transition:transform .18s ease}
.lang-switch.open .lang-btn .chev{transform:rotate(180deg)}
.lang-btn .cur{white-space:nowrap}
.lang-btn .cur .code{font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3,#6b7680);margin-left:2px}

.lang-menu{
  position:absolute;right:0;top:calc(100% + 8px);z-index:600;
  min-width:216px;max-height:min(66vh,460px);overflow:auto;
  background:#fff;border:1px solid var(--line,#e4e1db);border-radius:6px;padding:6px;
  box-shadow:0 2px 6px rgba(20,24,28,.06),0 18px 44px rgba(20,24,28,.16);
  display:none;margin:0;list-style:none;
}
.lang-switch.open .lang-menu{display:block}
.lang-menu li{margin:0}
.lang-menu a{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:8px 10px;border-radius:4px;font-size:.855rem;color:var(--ink-2,#3b4650);
  text-decoration:none;line-height:1.25;
}
.lang-menu a:hover{background:var(--paper-2,#f7f5f1);color:var(--ink,#14181c)}
.lang-menu a:focus-visible{outline:2px solid var(--accent,#8a5f2f);outline-offset:-2px}
.lang-menu a[aria-current="true"]{font-weight:600;color:var(--ink,#14181c);background:var(--accent-soft,#f0e7da)}
.lang-menu .en{font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3,#6b7680)}
.lang-menu a[aria-current="true"] .en{color:var(--accent-ink,#6d4a22)}

@media (max-width:900px){
  .lang-menu{min-width:196px;max-height:min(70vh,420px)}
}
@media (max-width:640px){
  .lang-switch .cur .code{display:none}
  .lang-menu{min-width:180px}
}
