/* ============================================================
   Mobile menu hitbox / 視覺分隔修補
   ------------------------------------------------------------
   2026-04-28 從 athena-front (Vue) 端移植回 Blade
   修「應用場域」第一個選單 hitbox 重疊 + 點擊到下一項的問題
   ============================================================ */

@media (max-width: 991.98px) {

  /* Mobile menu wrapper row 解除 nav 高度限制（核心修補）
     原 .main-nav .nav-outter .nav-inner .row { height: 100% } 會把
     mobile menu 外層 row 限成 50px → 50px 的隱形 div 蓋住第一個項目
     導致點擊穿透到下一個 menu */
  .main-nav .nav-outter .nav-inner > .row.d-md-none {
    height: auto !important;
    align-items: stretch !important;
    flex-wrap: wrap !important;
  }

  /* Mobile menu 整體下推一點，讓第一個 menu 跟 nav 留出 gap */
  .main-nav #collapseMenu {
    padding-top: 20px;
  }

  /* 各 menu item 加底線視覺分隔 + 第一個再多 gap */
  .main-nav #collapseMenu .nav-menu .nav-menu-item {
    border-bottom: 1px solid rgba(255, 255, 255, 0.18);
  }
  .main-nav #collapseMenu .nav-menu .nav-menu-item:first-child {
    margin-top: 8px;
  }
  .main-nav #collapseMenu .nav-menu .nav-menu-item:last-child {
    border-bottom: none;
  }

  /* nav-menu-link hitbox 至少 64px (符合 iOS HIG)、padding 對稱 */
  .main-nav #collapseMenu .nav-menu .nav-menu-item .nav-menu-link {
    padding: 1.25rem 1.875rem !important;
    min-height: 64px !important;
    box-sizing: border-box !important;
  }

  /* chevron icon 點擊穿透到 <a>，避免 hit 算到 icon 邊界外 */
  .main-nav #collapseMenu .accordion-icon {
    pointer-events: none;
  }

}
