/* ==========================================
   모바일 내비게이션 메뉴 (회색 박스 영역) 가독성 개선
   ========================================== */

/* 1. 메뉴 전체를 감싸는 드롭다운 박스 (회색 -> 깔끔한 화이트 카드) */
.navbar-custom .navbar-collapse {
  background-color: #1A2332 !important;
  border-radius: 12px !important;
  padding: 20px 16px !important;
  margin-top: 12px !important;
  border: 1px solid #374151 !important;
}

/* 2. 각 메뉴 항목 간격 */
.navbar-custom .navbar-nav .nav-item {
  margin: 6px 0;
}

/* 3. 메뉴 링크 텍스트 (흐릿한 흰색 -> 명확한 딥그레이) */
.navbar-custom .navbar-nav .nav-link {
  color: #F8FAFC !important;
  font-weight: 700 !important;
  text-align: center;
  padding: 12px !important;
}

/* 4. 마우스 호버(Hover) & 활성화(Active) 상태 */
.navbar-custom .navbar-nav .nav-link:hover,
.navbar-custom .navbar-nav .nav-link.active {
  color: #FF9800 !important; /* 깔끔한 블루 포인트 */
}

/* 데스크톱 화면(992px 이상)에서는 기존 내비게이션 스타일 유지 */
@media (min-width: 992px) {
  .navbar-custom .navbar-collapse {
    background-color: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin-top: 0 !important;
  }
  
  .navbar-custom .navbar-nav .nav-link {
    color: #FFFFFF !important; /* PC 화면에서는 다시 흰색 글자 */
  }
  
  .navbar-custom .navbar-nav .nav-link:hover,
  .navbar-custom .navbar-nav .nav-link.active {
    color: #FF9800 !important;
    background-color: transparent !important;
  }
}