/* =========================================================
   言語選択（ヘッダー）。全言語で共通の部品。
   日本語版にも出るが、main.css は変更しない方針のため、別ファイルにして、
   言語選択を表示するページ（公開済みの言語が 2 つ以上のとき）だけが読み込む。
   色・角丸などは main.css の変数を使う。
   ========================================================= */
.lang-menu { position: relative; font-size: 14px; }
.lang-menu > summary {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 40px;
  padding: 0 12px 0 10px;
  border: 1px solid var(--c-border);
  border-radius: 999px;
  background: var(--c-surface);
  color: var(--c-text);
  font-weight: 600;
  cursor: pointer;
  list-style: none;
  user-select: none;
}
.lang-menu > summary::-webkit-details-marker { display: none; }
.lang-menu > summary:hover { border-color: var(--c-primary); }
.lang-menu > summary:focus-visible { outline: 2px solid var(--c-primary); outline-offset: 2px; }
.lang-menu[open] > summary { border-color: var(--c-primary); background: var(--c-primary-tint); }
.lang-menu__icon { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.lang-menu__list {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 20;
  min-width: 200px;
  max-width: min(300px, calc(100vw - 32px));
  max-height: 70vh;
  overflow-y: auto;
  margin: 0;
  padding: 6px;
  list-style: none;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
  box-shadow: 0 6px 20px rgba(31, 41, 51, 0.12);
}
.lang-menu__item { display: block; padding: 10px 12px; border-radius: 8px; color: var(--c-text); text-decoration: none; overflow-wrap: anywhere; }
a.lang-menu__item:hover { background: var(--c-primary-tint); }
a.lang-menu__item:focus-visible { outline: 2px solid var(--c-primary); outline-offset: -2px; }
.lang-menu__item--current { color: var(--c-primary-dark); font-weight: 700; }
.lang-menu__note { display: block; padding: 0 12px 8px; color: var(--c-muted); font-size: 12px; line-height: 1.5; }
