/* シンプルな白基調ナビ */
.navbar {
  position: sticky; top: 0; z-index: 50;
  background: #fff; border-bottom: 1px solid #e5e7eb;
}
.navbar .inner {
  max-width: 980px; margin: 0 auto; padding: 10px 16px;
  display: flex; align-items: center; gap: 12px;
}
.navbar .brand {
  font-weight: 800; letter-spacing: .02em;
}
.navbar .spacer { flex: 1; }
.navbar a, .navbar button {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 12px; border-radius: 8px; text-decoration: none;
  border: 1px solid transparent; background: transparent; color: #111;
  cursor: pointer; font-size: 14px;
}
.navbar a:hover, .navbar button:hover { background: #f3f4f6; }
.navbar .primary {
  background: #111; color: #fff; border-color: #111;
}
.navbar .primary:hover { background: #333; border-color: #333; }
@media (max-width: 480px){
  .navbar .inner { gap: 8px }
  .navbar .hide-sm { display:none }
}

/*--------------------------------------*/
/* ====== ナビ全体 ====== */
.site-nav{
  display:flex;
  justify-content:space-between;   /* 左右へ配置 */
  align-items:center;
  gap: 12px;
  max-width: 1100px;               /* 中央寄せの幅 */
  margin: 0 auto;                   /* 中央寄せ */
  padding: 10px 16px;
  border-bottom: 1px solid #e5e7eb;
  background: #fff;                 /* 壁紙等の上でも読みやすく */
}

/* 左右の並び */
.nav-left, .nav-right{
  display:flex;
  align-items:center;
  gap: 12px;
  flex-wrap: wrap;
}

/* ロゴ＆リンク */
.nav-logo{
  font-weight:700;
  text-decoration:none;
  color:#111;
}
.nav-link{
  text-decoration:none;
  color:#111;
  padding: 6px 8px;
  border-radius: 8px;
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.nav-link:hover{ background:#f3f4f6; }

/* 「ログアウト」ボタンをリンク風に */
button.nav-link{
  background: transparent;
  border: none;
  cursor: pointer;
  font: inherit;
  color: #111;
}
/* ====== ナビ全体をflexで中央寄せ ====== */
.site-nav{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  max-width:1100px;
  margin:0 auto;
  padding:10px 16px;
  border-bottom:1px solid #e5e7eb;
  background:#fff;
}

/* 両サイドのコンテナ */
.site-nav .nav-left,
.site-nav .nav-right{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}

/* リンクのリセット＆見た目 */
.site-nav a.nav-link,
.site-nav a.nav-logo,
.site-nav button.nav-link{
  text-decoration:none;
  color:#111;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 8px;
  border-radius:8px;
}
.site-nav a.nav-logo{ font-weight:700; }
.site-nav a.nav-link:hover{ background:#f3f4f6; }

/* ボタンをリンク風に（site.cssのbuttonスタイルを打ち消す） */
.site-nav button.nav-link{
  background:transparent !important;
  border:0 !important;
  cursor:pointer;
  font:inherit;
  color:#111 !important;
  line-height:1.2;
}

/* ボタンをリンク風に（既存ボタンの黒背景を打ち消し） */
.navbar .linklike{
  background: transparent !important;
  border: 0 !important;
  color: inherit !important;
  font: inherit;
  padding: 0 6px;
  cursor: pointer;
}

/* 会員番号/氏名バッジ */
.navbar .acct-badge{
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: 4px 10px;
  border: 1px solid #e5e7eb;
  border-radius: 999px;
  background: #f7f7ff;
  font-size: .9rem;
  white-space: nowrap;
  cursor: pointer;
}
.navbar .acct-badge:hover{ background: #eef1ff; }