/* ============================================================
 * members-header.css — 会員ヘッダー（上部固定バー横並び）
 *
 * 役割: 公開グローバルメニュー（global-nav.css の縦型右レール #main-Nav ＋
 *   site-Header-pb1 ロゴ ＋ menu-Overlay）を、会員ページでは「上部固定バー横並び」へ
 *   再レイアウトする override。global-nav.css の後に読み込んで body#members で勝たせる。
 *   開閉JS=home-globalmenu.js / ログイン出し分け=home-login-menu.js はそのまま再利用。
 *
 * 方針:
 *   - 上部に全幅・白の固定バー（高さ var(--mh-bar-h)）。
 *   - ロゴ＝バー左。ハンバーガー(.menu-Btn)＋ログイン出し分け＝バー右に横並び。
 *   - 左サイドバーナビ(.sidebar-nav)は非変更。バー下から開始するよう top オフセット。
 *   - 既存 .members-content margin-top(55px) をバー高さに合わせて調整。
 *   - v1: 公開レールの Court/Tournament/Event/Store/Search 縦アイコン群(.sp-Footer)は
 *         上部バーでは非表示にし、全ナビはハンバーガー→オーバーレイに集約する。
 * ============================================================ */

body#members {
  --mh-bar-h: 60px;
}

/* === 上部固定バー本体（.site-Header-pb1 を白バー化） === */
body#members .site-Header-pb1 {
  height: var(--mh-bar-h);
  background-color: var(--color-brand-blue);   /* バーをブランドブルーに（白文字・白ロゴが映える） */
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.12);
  z-index: 5000;
  /* pointer-events:none（公開）は維持＝ロゴのみクリック可・バー背景は素通し。
     右の #main-Nav は z-index 100002 で上に乗りクリック可。 */
}
/* 青バーでは白ロゴを常時表示（JS背景サンプリングに依存せず固定） */
body#members .site-Header-pb1 .logo-light { opacity: 0; }
body#members .site-Header-pb1 .logo-dark  { opacity: 1; }
body#members .site-Header-pb1 .wrapper {
  max-width: none;
  width: 100%;
  height: 100%;
  align-items: center;
  padding-left: 20px;
  padding-right: 0;
}
body#members .site-Header-pb1 .site-Logo {
  margin-top: 0;
  width: clamp(8rem, 7rem + 4vw, 10.5rem);
}

/* === 右メニュー：縦レール → 上部バー右端の横並び === */
body#members #main-Nav {
  top: 0;
  right: 0;
  height: var(--mh-bar-h);
  width: auto;
  flex-direction: row;
  align-items: stretch;
  background: transparent;
  border-left: none;
  /* Menu のオレンジ領域は画面右端まで確保（右余白は付けない）。点の間隔はボタン内 padding で調整。 */
}
body#members #main-Nav .nav-content-Scroll {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  height: 100%;
  width: auto;
}
/* Menu(DOM先頭)を右端へ、ログインをその左へ（row-reverse） */
body#members #main-Nav .g-Navigation.sp-Header {
  display: flex;
  flex-direction: row-reverse;
  align-items: stretch;
  height: 100%;
  width: auto;
}
/* バー上の文字は白（青背景に映えるように）。Login(未ログイン)テキスト＋ログイン名 */
body#members #main-Nav .g-Navigation .top-Level a { color: #fff; }
body#members .login-Name { color: #fff; white-space: nowrap; font-size: 10px; line-height: 1.1; }
/* v1: 縦アイコン群（Court/Tournament/Event/Store/Search）は上部バーでは非表示。
   全ナビはハンバーガー→オーバーレイに集約。 */
body#members #main-Nav .g-Navigation.sp-Footer {
  display: none;
}
body#members #main-Nav .g-Navigation .top-Level {
  display: flex;
  align-items: stretch;
  height: 100%;
}
body#members #main-Nav .g-Navigation .top-Level a {
  min-height: 0;
  height: 100%;
  flex-direction: row;
  align-items: center;
  width: auto;
  padding: 0 16px;
}
body#members #main-Nav .g-Navigation .top-Level .nav-Icon,
body#members #main-Nav .g-Navigation .top-Level img {
  margin: 0 6px 0 0;
}

/* ハンバーガー：バー高さに合わせて横並び化 */
body#members .menu-Btn {
  height: var(--mh-bar-h);
  width: auto;
  min-width: 72px;
  padding: 9px 18px;        /* 上下paddingで点が上端に張り付かないよう中央寄せ＋オレンジ領域は端まで維持 */
  justify-content: center;
  gap: 3px;
}
body#members .menu-Btn .btn-Text {
  font-size: 11px;
  line-height: 1.1;
}

/* ログイン出し分け：バー内で縦中央・横並び */
/* 公開の縦レール由来 min-height:100px を打ち消し、アバター＋名前をバー(60px)内で縦中央に。
   min-height が残ると summary が 100px になりアイコンが下に落ちる。 */
body#members #main-Nav .login-Item,
body#members .login-Menu,
body#members .login-Summary {
  min-height: 0;
  height: var(--mh-bar-h);
}
body#members #main-Nav .login-Item,
body#members .login-Menu {
  display: flex;
  align-items: center;
}
body#members .login-Summary {
  display: flex;
  flex-direction: column;    /* アイコン上・ニックネーム下（60px バー内に収める） */
  align-items: center;
  justify-content: center;
  gap: 1px;
  padding: 0 12px;
  cursor: pointer;
  line-height: 1;
}
body#members .login-Avatar img {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: block;
}

/* === オーバーレイ：会員は縦レール分(100px)を空けず全幅で右からスライド === */
body#members .menu-Overlay {
  right: 0;
  width: 100vw;
}

/* === 左下フローティング Search ボタンは不要（検索導線はサイドバー「イベントサーチ」等にあり） === */
body#members .floating-event-searching {
  display: none;
}

/* === 上部バー分のオフセット（コンテンツ・固定サイドバーをバー下へ） === */
body#members .members-content {
  margin-top: var(--mh-bar-h);
}
@media print, screen and (min-width: 835px) {
  body#members .sidebar-nav {
    top: 0;   /* 画面最上端まで伸ばす（ヘッダーがこの上に載る）。ヘッダーがスライドアウトしても
                 サイドバー上端が切れない。 */
    padding-top: calc(var(--mh-bar-h) + 28px);   /* 先頭「会員HOME」をヘッダー(60px)下＋余白に */
  }
}

/* ============================================================
 * 投稿フォーム（single-organizers.php）を会員カラム（.members-main 1010px）に収める。
 *   custom-insider-form はデフォルトの広い chrome 幅前提の箇所があり、会員カラムに入れると
 *   一部要素が横にはみ出して水平スクロールが出る（崩れ）。カラム内に収める。
 * ============================================================ */
/* イベント名サジェスト用コンテナが固定幅(約1254px)でカラムを超える主因 → カラム内に収める */
body#members #eventNameSuggestionsContainer {
  max-width: 100%;
}
/* タイトルの微小はみ出し対策 */
body#members .members-main .entry-title {
  max-width: 100%;
}
/* 安全網：会員本文カラム外への水平はみ出しを止める（overflow-x:clip は縦のドロップダウン等は維持）。
   position:relative＝サジェスト(position:absolute・幅指定)の基準を article(幅広)からカラムに移し、
   幅・clip がカラム基準で効くようにする（これが無いと基準が祖先のため効かない）。 */
body#members .members-main {
  position: relative;
  overflow-x: clip;
}
/* 投稿フォーム本文（.members-posting-form＝single-organizers.php のラッパー）に左右＋下の余白。
   会員カラムには #main 相当の余白が無く、フォームが左右端まで詰まって「枠が無い」見えになるため。
   ※自前 entry-content を撤去し chrome の entry-content と二重化しない方針に伴い、専用ラッパーに付与。 */
body#members .members-posting-form {
  padding: 8px 24px 32px;
}

/* ============================================================
 * 会員エリア 簡素フッター（.members-global-footer）
 *   公開 home-footer-kampu を会員向けに削ぎ落とし。固定 bottom-nav とは別。
 * ============================================================ */
body#members .members-global-footer {
  position: relative;
  z-index: 1;                  /* 固定サイドバー(z-index auto=0)より上・固定 bottom-nav(z-index 2)より下。
                                  ＝左メニューには被せるが固定フッター(bottom-nav)の下に潜る */
  background: var(--color-brand-blue);
  color: #fff;
  padding: 36px 20px 96px;     /* SP: 下は固定 bottom-nav 分の余白 */
  margin-top: 48px;
}
@media print, screen and (min-width: 835px) {
  body#members .members-global-footer {
    padding-bottom: 36px;      /* PC は bottom-nav 非表示 */
    /* margin-left は付けない＝全幅で左サイドバーの上に被せる */
  }
}
body#members .members-global-footer .mgf-Inner {
  max-width: 960px;
  margin: 0 auto;
  text-align: center;
}
body#members .members-global-footer .mgf-Nav ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px 24px;
  list-style: none;
  margin: 0 0 22px;
  padding: 0;
}
body#members .members-global-footer .mgf-Nav a {
  color: #fff;
  text-decoration: none;
  font-size: 14px;
}
@media (hover: hover) {
  body#members .members-global-footer .mgf-Nav a:hover { text-decoration: underline; }
}
body#members .members-global-footer .mgf-Logo img {
  width: 168px;
  height: auto;
  display: block;
  margin: 0 auto 14px;
}
body#members .members-global-footer .mgf-Copyright {
  font-size: 12px;
  opacity: 0.85;
  margin: 0;
}

/* === 会員: home-globalmenu.js の rail-hide(opacity)を無効化 ===
   会員ページでは home-globalmenu.js の footer 検出が固定 bottom-nav を拾い、少しのスクロールで
   .is-rail-hidden(opacity:0)が付いてヘッダーが消える。会員では opacity 制御を無効化し、
   ヘッダーの消滅は members-header-scroll.js の「実フッター連動スライド」に一本化する。 */
body#members .site-Header-pb1.is-rail-hidden,
body#members #main-Nav.is-rail-hidden {
  opacity: 1;
  pointer-events: auto;
}
/* スライド時のなめらかさ（スクロール連動 transform 用） */
body#members .site-Header-pb1,
body#members #main-Nav {
  will-change: transform;
}

/* === 会員: 「上に戻る」ボタンを少し下げる === */
body#members .go-to-top,
body#members .cat-members .go-to-top {
  bottom: 80px;   /* 既定125px(PC) → 少し下げる */
}
