/* Language Controller by SG Group — TCD ヘッダー言語切替（3.1.0 §8-10）。 */

.sglc-lang-switcher {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  line-height: 1;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  z-index: 5;
}
/* mount 完了までのレイアウトジャンプ抑制（JS 有効時）。JS 無効時は <noscript> が可視化。 */
.sglc-switcher--unmounted { visibility: hidden; }
/* container 不在時の fallback（本文先頭・隠さない）。 */
.sglc-switcher--fallback {
  display: inline-flex;
  margin: 6px 12px;
  padding: 4px 8px;
}
/* その viewport で無効化された場合のみ非表示。 */
.sglc-lang-switcher[data-pos="hidden"] { display: none; }

.sglc-lang-switcher__globe {
  display: inline-flex;
  align-items: center;
  color: currentColor;
  opacity: 0.85;
}
.sglc-lang-switcher__globe svg { display: block; }

.sglc-lang-switcher__lang {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 26px;
  min-height: 44px;               /* タップ領域 44px（§9）。PC では余白で吸収。 */
  padding: 0 4px;
  color: currentColor;
  text-decoration: none;
  opacity: 0.6;
  border-radius: 6px;
}
.sglc-lang-switcher__lang:hover { opacity: 0.9; }
.sglc-lang-switcher__lang:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
/* 現在言語: 文字＋状態で強調（色だけに依存しない）。 */
.sglc-lang-switcher__lang[aria-current="true"] {
  opacity: 1;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.sglc-switcher--accent .sglc-lang-switcher__lang[aria-current="true"] {
  color: var(--tcd-accent-color, currentColor);
}
.sglc-lang-switcher__sep { opacity: 0.4; font-weight: 400; }

/* PC: ロゴ左・ヘッダー高さを増やさない。 */
.p-header__bar__inner > .sglc-lang-switcher[data-pos="pc"] {
  margin-right: 14px;
  align-self: center;
}

/* mobile: ハンバーガー左・44px・safe-area・折返し禁止。 */
@media (max-width: 991px) {
  .sglc-lang-switcher[data-pos="mobile"] {
    margin-right: 8px;
    padding-right: env(safe-area-inset-right, 0px);
  }
  .sglc-switcher--compact .sglc-lang-switcher__lang { min-width: 22px; padding: 0 2px; }
  .sglc-switcher--compact .sglc-lang-switcher__sep { margin: 0 -1px; }
}
/* 320px 最小幅でも消さず、地球アイコン・現在言語を維持し余白のみ縮小（§9）。 */
@media (max-width: 360px) {
  .sglc-lang-switcher { gap: 2px; font-size: 12px; }
  .sglc-lang-switcher__lang { min-width: 20px; padding: 0 1px; }
}

@media (prefers-color-scheme: dark) {
  .sglc-lang-switcher__lang:focus-visible { outline-color: #fff; }
}
