/* === FoodNo1 主題樣式 for Helix Ultimate === */

/* --- Body 與基本排版 --- */
body {
  font-family: "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", sans-serif;
  font-size: 16px;
  line-height: 1.7;
  color: #333;
  background-color: #fffdf5;
}

/* --- 標題樣式 --- */
h1, .h1 { font-size: 30px; font-weight: 700; }
h2, .h2 { font-size: 26px; font-weight: 600; }
h3, .h3 { font-size: 22px; font-weight: 600; }
h4, .h4 { font-size: 18px; font-weight: 500; }

@media (max-width: 768px) {
  h1, .h1 { font-size: 24px; }
  h2, .h2 { font-size: 22px; }
  h3, .h3 { font-size: 20px; }
  h4, .h4 { font-size: 17px; }
}

/* --- 連結樣式 --- */
a {
  color: #d18f00;
  text-decoration: none;
}
a:hover {
  color: #efc562;
  text-decoration: underline;
}

/* --- 按鈕 --- */
button,
.btn {
  background-color: #efc562;
  color: #000;
  border: none;
  border-radius: 6px;
}
button:hover,
.btn:hover {
  background-color: #d18f00;
  color: #fff;
}

/* --- 模組外觀卡片感 --- */
.moduletable, .module {
  background-color: #fffaf0;
  border: 1px solid #e0d4b8;
  border-radius: 8px;
  padding: 15px;
  margin-bottom: 20px;
  box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}
.moduletable h3, .module h3 {
  font-size: 18px;
  font-weight: bold;
  color: #5a4b3b;
  border-bottom: 2px solid #efc562;
  padding-bottom: 5px;
  margin-bottom: 10px;
}

/* --- Menu 橫向排列 --- */
.mod-menu ul,
.mod-menu ul.menu,
.mod-menu > ul {
  display: flex !important;
  flex-direction: row !important;
  justify-content: flex-end !important;
  flex-wrap: wrap;
  list-style: none;
  gap: 12px;
  margin: 0;
  padding-left: 0;
}
.mod-menu li {
  display: inline-block !important;
  margin: 0;
}
.mod-menu a {
  display: inline-block !important;
  padding: 6px 12px;
  font-weight: bold;
  text-decoration: none;
  color: #333;
}
.mod-menu a:hover {
  background-color: #f0f0f0;
  border-radius: 4px;
}
/* --- top bar & body distance --- */
#sp-main-body {
  padding: 30px 0;
}
/* --- Kunena Avatar 圓角 & 替代圖示 --- */
.kavatar img[src*="gravatar.com/avatar"] {
  content: url('/images/fno1/kavatar.svg') !important;
  border-radius: 50%;
  width: 64px;
  height: 64px;
}

/* --- Kunena 主色與區塊設計 --- */
#Kunena {
  background-color: #fffdf5;
  color: #333;
}
#Kunena .kblock-header,
#Kunena .kforum-header,
#Kunena .ksection-header {
  background-color: #c29000 !important;
  color: #fff !important;
  font-weight: bold;
  padding: 10px 15px;
  border-radius: 6px;
}
.klist-row {
  background-color: #fdf6e3;
  border-bottom: 1px solid #eadbb9;
  padding: 12px 10px;
}
.klist-row:hover {
  background-color: #e7b93d !important;
  color: #000 !important;
}

/* === FoodNo1 2025/06/05 新增：Footer + Tags + Menu 美化 === */

/* 1. Footer 深金底 + 淺金字 */
#sp-footer {
  background-color: #c29000;
  color: #fff8dc;
}
#sp-footer a {
  color: #fff8dc;
  text-decoration: none;
}
#sp-footer a:hover {
  color: #ffffff;
  text-decoration: underline;
}

/* 2. Topbar 背景與字色 */
#sp-top-bar {
  background-color: #fffdf5 !important;
  color: #333;
}
#sp-top-bar a {
  color: #333;
}
#sp-top-bar a:hover {
  color: #d18f00;
}

/* 3. Megamenu 下拉選單 */
.sp-megamenu-parent .sp-dropdown {
  background-color: #fffaf0;
  border: 1px solid #f0e2c5;
  border-radius: 6px;
  padding: 10px 15px;
}
.sp-megamenu-parent .sp-dropdown li a {
  color: #5a4b3b;
  font-weight: 500;
}
.sp-megamenu-parent .sp-dropdown li a:hover {
  background-color: #f8e6b9;
  color: #000;
  border-radius: 4px;
}

/* 4. Tags 統一樣式 */
.tags span.label {
  background-color: #fef1e5;
  color: #d15700;
  border-radius: 24px;
  padding: 6px 12px;
  display: inline-block;
  margin: 4px;
  font-weight: 500;
}
.tags span.label:hover {
  background-color: #fce4ba;
  color: #000;
  text-decoration: none;
}

/* 5. 全站文章標題淡藍色 */
.article-title,
.item-title,
.blog .page-header h2,
.category-list .page-header h2,
h2.article-title {
  color: #215C96;
}
.article-title a:hover,
.item-title a:hover {
  color: #1c4e80;
}

/* 6. 文章數量藍色徽章 */
.badge.badge-pill {
  background-color: #4a90e2 !important;
  color: #fff !important;
  font-weight: bold;
  border-radius: 50px;
}

/* 7. breadcrumb 改為金灰色 */
.breadcrumb,
.breadcrumb .breadcrumb-item,
.breadcrumb .breadcrumb-item a {
  background-color: #f3e7c3 !important;
  color: #6c5430 !important;
}
.breadcrumb .breadcrumb-item.active {
  font-weight: bold;
}

/* 8. content-top 與 menu 間距縮小 */
.sp-page-builder .page-content #section-id-1 {
  margin-top: 10px !important;
}

/* 9. sticky feature module 顯示優化 */
.sticky-feature-module {
  position: absolute;
  top: 20px;
  right: 30px;
  background-color: #fff8d5;
  color: #333;
  border-radius: 6px;
  padding: 6px 12px;
  font-weight: bold;
  z-index: 99;
}

/* 10. tag hover 效果清除藍色 */
.tag-cloud a:hover,
a.tag:hover {
  background-color: #efc562 !important;
  color: #000 !important;
}

/* 最後統一預防干擾 */
.badge, .tag, .breadcrumb {
  border: none !important;
  box-shadow: none !important;
}
/* === 修正區 2025-06-05 晚間版 === */

/* 1. Menu 背景色統一為淡米色 */
#sp-header, .sp-megamenu-parent {
  background-color: #fffdf5 !important;
}

/* 2. 全站文章標題淡藍色修正 */
.article-title, .item-title, .page-header h2 {
  color: #215C96 !important;
}
.article-title a:hover,
.item-title a:hover {
  color: #1c4e80 !important;
}

/* 3. 內容區與 top-bar 間距調整（從 150px 降為 40px） */
.sp-page-builder .page-content {
  margin-top: 40px !important;
}

/* 4. yellow promo 模組 padding 微調為 5px */
.sp-module.promo-yellow,
.module.promo-yellow,
.moduletable.promo-yellow {
  padding: 5px !important;
  background-color: #ffeb3b;
  border-radius: 8px;
}

/* 給指定模組 class 額外內距 */
.fno1-padding-box {
  padding: 20px;
}

/* 統一讓所有模組中的表格內格（td）有內距 */
.moduletable table td,
.sp-module table td,
.module table td {
  padding: 10px;
}
/* === FoodNo1 模組統一間距與標準化樣式（2025/06/06）=== */

/* 所有模組底部加空間 */
.moduletable, .sp-module, .module {
  margin-bottom: 20px !important;
}

/* 模組本體額外內距（通用） */
.moduletable, .sp-module, .module {
  padding: 15px !important;
  border-radius: 8px;
  background-color: #fffaf0;
  border: 1px solid #e0d4b8;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
}

/* 模組標題統一樣式 */
.moduletable h3, .sp-module h3, .module h3 {
  font-size: 18px;
  font-weight: bold;
  color: #5a4b3b;
  border-bottom: 2px solid #efc562;
  padding-bottom: 5px;
  margin-bottom: 10px;
}

/* 表格內部 padding */
.moduletable table td,
.sp-module table td,
.module table td {
  padding: 10px;
}
.fno1-noborder {
  border: none !important;
  box-shadow: none !important;
  background: none !important;
  padding: 0 !important;
  margin-bottom: 10px; /* 或依需要調整 */
}
.fno1-footer-lighttext {
  color: #3b2f1b !important;
}
.fno1-footer-lighttext a {
  color: #c29000 !important;
  text-decoration: underline;
}
.sp-module table td,
.module table td,
.moduletable table td {
  padding: 10px;
}