/* ============================
   WPML 言語スイッチャー（新宿院・skin_tcd046）
   ============================
   本サイト(serum)→渋谷(cure)→池袋(birth)→大宮(monad)版を移植。skin_tcd046 の実測
   （2026-07-05 本番 DevTools getComputedStyle）:
   - #header は body 直下・position:static / height:80px（子テーマ!important）。
     header_fix.js はあるが body に fix_top/mobile_fix_top クラスが無く固定化しない（実測）
     → #ic-top-bar は #header 直前の通常フロー帯・ページと一緒にスクラウトする（最単純）
   - SPメニューはドロワー別要素でなく同一の #global_menu を jscript.js が show/hide
     （≤991px で absolute ドロップダウン・top:60px・z-index:9・bg #e3d0c3）
   - ブレークポイント 991px（子テーマ style.css も 991/992px で統一）
   - 子テーマの `#global_menu ul > li { height:80px !important }`(≥992px) が追加liにも
     マッチするため、PC側は display:none !important で確実に無効化する */

.ic-lang-switcher {
    position: relative;
    z-index: 21; /* 親テーマ #global_menu(z:20)より前面 */
    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: 21; /* 親テーマ #global_menu(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; }

/* モバイル: バーを少し低く、左右パディングを詰める（skin のBP=991px に合わせる） */
@media screen and (max-width: 991px) {
    :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; }
}

/* ============================
   SPドロップダウンメニュー(#global_menu・≤991px)内の言語スイッチャー
   ============================
   wp_nav_menu_items で global-menu 末尾に .ic-drawer-lang を追加。skin は同じ #global_menu が
   PC横並びメニュー(≥992px)と SPドロップダウン(≤991px・.menu_buttonでshow/hide)を兼ねるため、
   同じ li が両表示に出る。PC では非表示にし、SPドロップダウン内のみ表示する。
   （子テーマの `#global_menu ul > li { height:80px !important }` 対策で display:none も !important） */
.ic-drawer-lang { display: none !important; }

@media only screen and (max-width: 991px) {
    #global_menu .ic-drawer-lang {
        display: block !important;
        padding: 14px 15px 16px;
        background: rgba(255, 255, 255, 0.25);
    }

    #global_menu .ic-drawer-lang__label {
        display: block;
        margin-bottom: 8px;
        font-size: 12px;
        letter-spacing: 0.06em;
        color: #6b5847;
    }

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

    /* 親テーマ responsive.css の mobile ルール `#global_menu a { color:#fff !important }` が
       ドロワー言語リンクの文字色を白に強制し、白背景の非アクティブ項目が不可視になる。
       !important で対抗して濃色（アクティブは白のまま青背景で可視）にする。 */
    #global_menu .ic-drawer-lang__item {
        display: inline-block;
        padding: 8px 16px;
        font-size: 14px;
        line-height: 1.2;
        color: #333 !important;
        text-decoration: none;
        border: 1px solid #ccd5dd;
        border-radius: 4px;
        background: #fff;
    }

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