.dropdown-submenu {
  position: relative;
}

.dropdown-submenu .dropdown-menu {
  top: 0;
  left: 100%;
  margin-top: -1px;
}

/* 在桌面版時滑鼠懸停顯示子選單 */
@media (min-width: 992px) {
  .dropdown-submenu:hover > .dropdown-menu {
    display: block;
  }
}

.dropdown-submenu > a:after {
  display: block;
  content: " ";
  float: right;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
  border-width: 5px 0 5px 5px;
  border-left-color: #ccc;
  margin-top: 5px;
  margin-right: -10px;
}

/* 在行動裝置上顯示子選單的樣式 */
@media (max-width: 991.98px) {
  .dropdown-submenu .dropdown-menu {
    position: static;
    left: 0;
    width: 100%;
    margin-top: 0;
    background-color: #f8f9fa;
    border: none;
    box-shadow: none;
    padding-left: 15px;
  }
  
  /* 強制顯示被標記為 .show 的選單 */
  .dropdown-menu.show {
    display: block !important;
  }
  
  /* 強制顯示被標記為 .show 的父選單 */
  .dropdown.show > .dropdown-menu {
    display: block !important;
  }
  
  /* 強制顯示被標記為 .show 的子選單 */
  .dropdown-submenu.show > .dropdown-menu {
    display: block !important;
  }
  
  .dropdown-submenu > a:after {
    transform: rotate(90deg);
    transition: transform 0.3s;
  }
  
  .dropdown-submenu > a.show:after {
    transform: rotate(0deg);
  }
  
  /* 禁用 Bootstrap 的滑鼠懸停效果，確保只有點擊能展開 */
  .navbar .dropdown:hover > .dropdown-menu {
    display: none;
  }
  
  .navbar .dropdown-submenu:hover > .dropdown-menu {
    display: none;
  }
}
