/* 課程列表篩選面板 — 強制版面（獨立檔避免被舊 style.css 快取蓋掉） */
#ageOptions,
#priceOptions,
#areaOptions,
.shop-sheet__body--list {
  display: grid !important;
  grid-template-columns: 1fr !important;
  grid-auto-flow: row !important;
  gap: 8px !important;
  align-content: start !important;
}

#ageOptions .shop-option,
#priceOptions .shop-option,
#areaOptions .shop-option,
.shop-sheet__body--list .shop-option {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  float: none !important;
  flex: none !important;
  text-align: left !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
}

/* 月份：橫向＋換行，不橫向滑動隱藏 */
#monthOptions,
.shop-sheet__body--months {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  overflow-x: hidden !important;
}

#monthOptions .shop-option,
.shop-sheet__body--months .shop-option {
  flex: 0 0 calc(25% - 6px) !important;
  width: auto !important;
  max-width: none !important;
  box-sizing: border-box !important;
  text-align: center !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
}

#monthOptions .shop-option[data-value="all"],
.shop-sheet__body--months .shop-option[data-value="all"] {
  flex: 0 0 100% !important;
}

@media (min-width: 480px) {
  #monthOptions .shop-option,
  .shop-sheet__body--months .shop-option {
    flex-basis: calc(16.666% - 7px) !important;
  }

  #monthOptions .shop-option[data-value="all"],
  .shop-sheet__body--months .shop-option[data-value="all"] {
    flex-basis: 100% !important;
  }
}