/* =========================================================
   Navbar override (XL → LG 相当)
   ---------------------------------------------------------
   HTML は navbar-expand-xl のまま変更せず、
   992px（lg）以上を PC レイアウト（1200px以上と同等）
   として扱うためのカスタム CSS
   ========================================================= */

/* ---------------------------------------------------------
   992px（lg）以上で PC 用ナビゲーションを有効化
   --------------------------------------------------------- */
@media (min-width: 992px) {

  /* collapse 領域を常時展開状態にする
     -------------------------------------
     Bootstrap の collapse は JS により
     display / height を制御するため、
     明示的に上書きしてメニューを表示させる
  */
  .navbar-expand-xl .navbar-collapse {
    display: flex !important;   /* display:none を打ち消す */
    flex-basis: auto;
    height: auto !important;    /* 高さ 0 を防ぐ */
    visibility: visible;
  }

  /* 開閉アニメーション中（collapsing）も非表示にしない */
  .navbar-expand-xl .navbar-collapse.collapsing {
    display: flex !important;
  }

  /* ナビゲーション項目を横並びにする
     ---------------------------------
     1200px 未満では navbar-nav が
     flex-direction: column（縦並び）になるため、
     row（横並び）に戻す
  */
  .navbar-expand-xl .navbar-nav {
    flex-direction: row;
  }

  /* モバイル用に付与される縦方向マージンを解除 */
  .navbar-expand-xl .nav-item {
    margin-top: 0;
  }

  /* モバイル用の全幅リンクを解除 */
  .navbar-expand-xl .nav-link {
    width: auto;
  }

  /* PC レイアウトでは不要な
     ハンバーガーボタンを非表示にする */
  .navbar-expand-xl .navbar-toggler {
    display: none;
  }

  /* ドロップダウンを PC 向け挙動に戻す
     -----------------------------------
     モバイルでは position: static になるため、
     absolute に戻して親メニュー直下に表示させる
  */
  .navbar-expand-xl .dropdown-menu {
    position: absolute;
  }
}

/* =========================================================
   Dropdown width fix
   ---------------------------------------------------------
   PC レイアウト時、dropdown-menu の背景幅が
   親要素の影響で狭く計算され、
   文字列が背景からはみ出る問題への対処
   ========================================================= */

/* ドロップダウンの背景が
   中の文字列より小さくならないようにする */
.navbar-expand-xl .dropdown-menu {
  min-width: max-content; /* 文字列の最大幅以上に広げる */
  white-space: nowrap;    /* 途中で改行させない */
}

/* 念のため、項目側にも nowrap を指定（保険） */
.navbar-expand-xl .dropdown-menu .dropdown-item {
  white-space: nowrap;
}

/* =========================================================
   End of custom navbar overrides
   ========================================================= */