/* 懸掛縮排：用於 壹貳叁 等子項目 */
.hanging {
  padding-left: 2em;
  text-indent: -2em;
}

.hanging-3 {
  padding-left: 3em;
  text-indent: -3em;
}

/* ===========================
   Multi-level menu behavior
   1st level: dropdown DOWN
   2nd+ level: fly-out RIGHT
   =========================== */

/* 避免子選單被裁切 */
#masthead,
#site-navigation,
.main-navigation,
.header-wrap,
.main-navigation ul {
  overflow: visible;
}

/* Top menu */
.main-navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* 必須讓 li 當定位基準 */
.main-navigation li {
  position: relative;
}

/* ---- 第一層 sub-menu：往下 ---- */
.main-navigation > ul > li > .sub-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background-color: #fff;
  min-width: 240px;
  margin: 0;
  padding: 0;
  border: 1px solid #eee;
  box-shadow: 0 4px 8px rgba(0,0,0,0.15);
  z-index: 2000;
}

/* hover 顯示第一層 */
.main-navigation > ul > li:hover > .sub-menu {
  display: block;
}

/* ---- 第二層（巢狀 sub-menu）：往右 ---- */
.main-navigation .sub-menu .sub-menu {
  display: none;
  position: absolute;
  top: 0;
  left: 100%;
  background-color: #fff;
  min-width: 240px;
  margin: 0;
  padding: 0;
  border: 1px solid #eee;
  box-shadow: 0 4px 8px rgba(0,0,0,0.15);
  z-index: 3000;
}

/* hover 顯示第二層 */
.main-navigation .sub-menu li:hover > .sub-menu {
  display: block;
}

/* 子選單項目 */
.main-navigation .sub-menu li {
  border-bottom: 1px solid #eee;
}

.main-navigation .sub-menu li:last-child {
  border-bottom: none;
}

.main-navigation .sub-menu a {
  display: block;
  padding: 14px 18px;
  color: #333;
  white-space: normal;
}

.main-navigation .sub-menu a:hover {
  background-color: #b54434;
  color: #fff;
}

/* 箭頭：第一層 ▼、第二層 ▶ */
.main-navigation > ul > li.menu-item-has-children > a::after {
  content: " ▼";
  font-size: 10px;
  margin-left: 6px;
}

.main-navigation .sub-menu li.menu-item-has-children > a::after {
  content: " ▶";
  font-size: 10px;
  margin-left: 6px;
}

/* 如果第二層會超出螢幕右側：最後一個頂層選單讓它往左開（可依需要調整） */
.main-navigation > ul > li:last-child .sub-menu .sub-menu {
  left: auto;
  right: 100%;
}

/* 手機：建議維持往下（因為沒有 hover），避免飛出看不到 */
@media (max-width: 767px) {
  .main-navigation > ul > li > .sub-menu,
  .main-navigation .sub-menu .sub-menu {
    position: static;
    box-shadow: none;
    border: 0;
    min-width: 0;
  }

  .main-navigation li:hover > .sub-menu {
    display: block;
  }

  .main-navigation > ul > li.menu-item-has-children > a::after,
  .main-navigation .sub-menu li.menu-item-has-children > a::after {
    content: " ▼";
  }
}