/* ============================
   WPML 言語スイッチャー（大宮院・monad_tcd110）
   ============================
   本サイト(serum)→渋谷(cure)→池袋(birth)版を移植。monad_tcd110 の実測（2026-07-04 本番
   DevTools getComputedStyle）:
   - #header は body 直下・position:sticky / top:0 / z-index:100 / height:80px
   - #ic-top-bar は #header 直前の通常フロー帯 → スクロールでバーは流れ、header だけ sticky
     で上部に張り付く（重なりは発生しない）
   - ドロワーは親 footer.php が #drawer_menu(fixed / z-index:99999) 内へ
     wp_nav_menu(container_id='mobile_menu') をサーバー側で再描画（JSクローンではない）
   - ブレークポイント 1300px（未満で #global_menu 非表示・#drawer_menu_button 表示） */

.ic-lang-switcher {
    position: relative;
    z-index: 101; /* 親テーマ #header(z:100)より前面 */
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 0.5rem;
    align-items: center;
    font-size: 0.875rem;
}

.ic-lang-switcher__item { margin: 0; padding: 0; }

.ic-lang-switcher__item a {
    display: inline-block;
    padding: 0.25rem 0.5rem;
    color: #555;
    text-decoration: none;
    border: 1px solid transparent;
    border-radius: 0.25rem;
    transition: color 0.2s ease, border-color 0.2s ease, background-color 0.2s ease;
}

.ic-lang-switcher__item a:hover,
.ic-lang-switcher__item a:focus-visible {
    color: #059de5;
    border-color: #059de5;
}

.ic-lang-switcher__item.is-active a {
    color: #fff;
    background-color: #059de5;
    border-color: #059de5;
    pointer-events: none;
}

/* ============================
   言語切替トップバー（#header 直前の通常フロー帯）
   ============================ */
:root {
    --ic-topbar-h: 40px;
}

#ic-top-bar {
    position: relative;
    z-index: 101; /* 親テーマ #header(z:100)より前面 */
    width: 100%;
    height: var(--ic-topbar-h);
    background: #f2f6fa;
    border-bottom: 1px solid #e3e9ef;
    box-sizing: border-box;
}

#ic-top-bar .ic-top-bar__inner {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    height: 100%;
    padding: 0 30px;
    box-sizing: border-box;
}

/* バーが relative/z-index を担うため内側スイッチャーは中立化 */
#ic-top-bar .ic-lang-switcher { position: static; z-index: auto; }

/* モバイル: バーを少し低く、左右パディングを詰める（monad のBP=1300px に合わせる） */
@media screen and (max-width: 1300px) {
    :root { --ic-topbar-h: 36px; }
    #ic-top-bar .ic-top-bar__inner { padding: 0 15px; }
    .ic-lang-switcher { gap: 0.375rem; font-size: 0.8125rem; }
    .ic-lang-switcher__item a { padding: 0.375rem 0.5rem; }
}

/* ============================
   ドロワー(#drawer_menu)内の言語スイッチャー
   ============================
   wp_nav_menu_items で global-menu 末尾に .ic-drawer-lang を追加。monad は同じメニューを
   header.php(#global_menu・PC横並び) と footer.php(#drawer_menu > #mobile_menu・ドロワー)
   の2箇所で描画するため、同じ li が両方に出力される。表示は #drawer_menu 内のみに限定し、
   PCヘッダーのグローバルメニューでは非表示にする。 */
.ic-drawer-lang { display: none; }

/* PCヘッダーのグローバルメニューでは非表示（#header 配下にスコープ） */
#header #global_menu .ic-drawer-lang { display: none !important; }

#drawer_menu #mobile_menu .ic-drawer-lang {
    display: block !important;
    padding: 18px 20px;
    margin-top: 8px;
    border-top: 1px solid #e3e9ef;
    background: #f7fafc;
}

#drawer_menu #mobile_menu .ic-drawer-lang__label {
    display: block;
    margin-bottom: 10px;
    font-size: 12px;
    letter-spacing: 0.06em;
    color: #888;
}

#drawer_menu #mobile_menu .ic-drawer-lang__list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

#drawer_menu #mobile_menu .ic-drawer-lang__item {
    display: inline-block;
    padding: 8px 16px;
    font-size: 14px;
    line-height: 1.2;
    /* 親テーマ responsive.css(media=max-width:1391px) の `#mobile_menu a { color:#fff!important }`
       がモバイル幅で通常宣言に勝ち、白ボックス上で文字が不可視になる(2026-07-05 本番実測)。
       !important 同士は詳細度勝負となり本セレクター(0-2-1-0)が勝つ。 */
    color: #333 !important;
    text-decoration: none;
    border: 1px solid #ccd5dd;
    border-radius: 4px;
    background: #fff;
}

#drawer_menu #mobile_menu .ic-drawer-lang__item.is-active {
    color: #fff !important;
    background-color: #059de5;
    border-color: #059de5;
    pointer-events: none;
}