/* ============================
   WPML 言語スイッチャー（池袋院・birth_tcd057）
   ============================
   本サイト(serum)→渋谷(cure)版を移植。birth_tcd057 はヘッダー機構が単純:
   - #header は通常フロー（position:relative; z-index:20; top:0）
   - スライダー #header_slider は #header の後ろの兄弟（ヘッダーは重ならない）
   よって #ic-top-bar は「#container 先頭の通常フロー帯」とし、#header の前に積むだけで成立する
   （渋谷の home/absolute オフセットは不要）。スクロール時に親 header_fix.js が #header を fixed 化
   した場合、トップバーは既にスクロールアウトしているため打ち消し不要。
   ※ z-index/高さ/header_fix 挙動は staging で DevTools 実測のうえ確定すること。 */

.ic-lang-switcher {
    position: relative;
    z-index: 31;
    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;
}

@media (max-width: 768px) {
    .ic-lang-switcher { gap: 0.375rem; font-size: 0.8125rem; }
    .ic-lang-switcher__item a { padding: 0.375rem 0.5rem; }
}

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

#ic-top-bar {
    position: relative;
    z-index: 30; /* 親テーマ #header(z:20)より前面 */
    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; }

/* スマホ: バーを少し低く、左右パディングを詰める（birth のヘッダーBP=960px に合わせる） */
@media (max-width: 960px) {
    :root { --ic-topbar-h: 36px; }
    #ic-top-bar .ic-top-bar__inner { padding: 0 15px; }
}

/* ============================
   ドロワー(ハンバーガー)内の言語スイッチャー
   ============================
   wp_nav_menu_items で global-menu 末尾に .ic-drawer-lang を追加。親JS が #global_menu を
   clone() して #mobile_menu を生成するため、同じ li が #mobile_menu にも複製される。
   表示は #mobile_menu 内のみに限定し、ヘッダーのグローバルメニューでは非表示にする。 */
.ic-drawer-lang { display: none; }

/* ヘッダーのグローバルメニューでは非表示。
   親テーマ(birth_tcd057)の v1-v7 CSS が `#header #global_menu > ul > li { display:block !important }`
   (specificity 2,0,3) を当ててくるため、#header 配下にスコープし class を足した
   `#header #global_menu .ic-drawer-lang` (2,1,1) + !important で確実に勝たせる。
   ※ SPドロワーの clone は #mobile_menu（#header 外）に入るため、この非表示は clone 側に及ばない。
   （staging getComputedStyle 実測で確定 2026-06-23） */
#header #global_menu .ic-drawer-lang { display: none !important; }

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

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

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

#mobile_menu .ic-drawer-lang__item {
    display: inline-block;
    padding: 8px 16px;
    font-size: 14px;
    line-height: 1.2;
    color: #333;
    text-decoration: none;
    border: 1px solid #ccd5dd;
    border-radius: 4px;
    background: #fff;
}

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