/**********************************************************
 中華好報｜首頁＋分類頁 重置版（可直接整段貼上） 
 - 盡量只作用首頁(.home)與分類頁(.archive)，避免外溢
**********************************************************/

/* === 0) Gazette 基礎、安全強化 ==== */

/* 導覽列固定頂端（含管理列容錯） */
.site-header{
  position: sticky; top: 0; z-index: 9999;
  background:#fff; box-shadow:0 2px 10px rgba(0,0,0,.06);
}
body.admin-bar .site-header{ top:32px; }
@media (max-width:782px){ body.admin-bar .site-header{ top:46px; } }

/* 導覽列互動 */
.main-navigation a{ padding:12px 14px; font-weight:600; text-decoration:none; }
.main-navigation a:hover,
.main-navigation .current-menu-item>a{ border-bottom:2px solid #0a66c2; }

/* 文章上的分類小標籤 */
/* ===== 分類膠囊：分類頁 + 單篇文章頁統一藍底白字 ===== */
.cat-links a,
.cat-links a:link,
.cat-links a:visited,
.cat-links a:hover,
.cat-links a:active,
.cat-links a:focus,
.entry-categories a,
.entry-categories a:link,
.entry-categories a:visited,
.entry-categories a:hover,
.entry-categories a:active,
.entry-categories a:focus,
.entry-meta .cat-links a,
.entry-meta .cat-links a:link,
.entry-meta .cat-links a:visited,
.entry-meta .cat-links a:hover,
.entry-meta .cat-links a:active,
.entry-meta .cat-links a:focus,
.single .entry-header .cat-links a,
.single .entry-header .cat-links a:link,
.single .entry-header .cat-links a:visited,
.single .entry-header .cat-links a:hover,
.single .entry-header .cat-links a:active,
.single .entry-header .cat-links a:focus {
  display: inline-block !important;
  background: #0a66c2 !important;
  color: #ffffff !important;
  border: none !important;
  padding: 4px 12px !important;
  margin-right: 8px !important;
  border-radius: 999px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  text-decoration: none !important;
  box-shadow: none !important;
}

/* 滑過去維持白字，只讓底色略深 */
.cat-links a:hover,
.entry-categories a:hover,
.entry-meta .cat-links a:hover,
.single .entry-header .cat-links a:hover {
  background: #084f99 !important;
  color: #ffffff !important;
}
.cat-links a:hover,.entry-categories a:hover{ filter:brightness(1.05); }

/* 想分色可自行調整 slug：範例 */
.cat-links a[href*="/category/tainan-news/"]{ background:#0a66c2!important; }
.cat-links a[href*="/category/chiayi-news/"]{ background:#e53935!important; }
.cat-links a[href*="/category/agri-news/"]  { background:#2e7d32!important; }
.cat-links a[href*="/category/travel-food/"]{ background:#8e24aa!important; }
.cat-links a[href*="/category/police-news/"]{ background:#fb8c00!important; }

/* 隱藏留言區與導覽（你需要時再開） */
.entry-meta .comments-link, .post .comments-link, .featured-content .comments-link,
#comments, .comments-area, .comment-respond, .post-navigation{ display:none!important; }

/* ========== A) 首頁焦點輪播（Spectra Post Carousel / Swiper 結構） ========== */
/* 目標：圖片全 16:9、標題壓在圖上、箭頭與 dots 乾淨。   */
/* 作法：只鎖首頁 .home，並兼容 Spectra 新舊 class 與 Swiper DOM */

.home .spectra-post-carousel__image-wrap,
.home .spectra-post-carousel__image,
.home .uagb-post__image,
.home .wp-block-post-featured-image,
.home .swiper-slide figure{
  position:relative; width:100%; padding-top:56.25%; /* 16:9 */
  overflow:hidden;
}
.home .spectra-post-carousel__image-wrap img,
.home .spectra-post-carousel__image img,
.home .uagb-post__image img,
.home .wp-block-post-featured-image img,
.home .swiper-slide figure img{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:center; display:block;
}

/* 每張投影片提供定位 */
.home .spectra-post-carousel__slide,
.home .spectra-post-carousel__post,
.home .swiper-slide{ position:relative; }

/* 標題拉到圖片底部（Spectra 版本差異以 caption/content/text 三罩一） */
.home .spectra-post-carousel__caption,
.home .spectra-post-carousel__content,
.home .spectra-post-carousel__text{
  position:absolute; left:0; right:0; bottom:0;
  margin:0; padding:14px 18px; background:rgba(0,30,80,.68); z-index:20;
}
.home .spectra-post-carousel__caption a,
.home .spectra-post-carousel__content a,
.home .spectra-post-carousel__text a{
  color:#fff!important; font-weight:700; line-height:1.35; text-decoration:none!important;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  font-size:20px;
}
@media (max-width:768px){
  .home .spectra-post-carousel__caption a,
  .home .spectra-post-carousel__content a,
  .home .spectra-post-carousel__text a{ font-size:17px; }
}

/* Hover 深色 */
.home .spectra-post-carousel__slide:hover .spectra-post-carousel__caption,
.home .spectra-post-carousel__slide:hover .spectra-post-carousel__content,
.home .spectra-post-carousel__slide:hover .spectra-post-carousel__text{
  background:rgba(0,30,80,.85);
}

/* Swiper 箭頭／dots 樣式（若有） */
.home .swiper-button-prev, .home .swiper-button-next{
  width:40px; height:40px; border-radius:9999px;
  background:rgba(0,0,0,.25); backdrop-filter:blur(2px);
}
.home .swiper-button-prev::after, .home .swiper-button-next::after{ font-size:16px; color:#fff; }
.home .swiper-button-prev:hover, .home .swiper-button-next:hover{ background:rgba(0,0,0,.45); }
.home .swiper-pagination-bullet{ width:8px; height:8px; background:#c6d3ea; opacity:1; }
.home .swiper-pagination-bullet-active{ background:#00306e; }

/* 防止輪播內部 padding 擠出標題 */
.home .spectra-post-carousel__text{ margin:0; padding:0; min-height:0; }

/* ========== B) 首頁下方：最新/精選新聞列表（核心 Query Loop） ========== */
/* 目標：桌機兩欄、手機一欄；縮圖 16:9、一致；不需要你再加類別。 */
/* 注意：若首頁有不只一個 Query Loop 都想吃這套，這段正好；若只想給特定區塊吃，再叫我改成 class 定位。 */

.home .wp-block-query .wp-block-post-template{
  display:grid; gap:24px; grid-template-columns:repeat(2, minmax(0,1fr));
}
@media (max-width:768px){
  .home .wp-block-query .wp-block-post-template{ grid-template-columns:1fr; gap:16px; }
}

/* 縮圖一致 16:9 + 圓角 */
.home .wp-block-query .wp-block-post-featured-image{
  position:relative; width:100%; padding-top:56.25%;
  overflow:hidden; border-radius:10px;
}
.home .wp-block-query .wp-block-post-featured-image img{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:center; display:block; transition:transform .25s ease;
}
.home .wp-block-query .wp-block-post:hover .wp-block-post-featured-image img{ transform:scale(1.04); }

/* 避免卡片被主題設成 flex 導致內容擠窄 */
.home .wp-block-query .wp-block-post{ display:block; }

/* ========== C) 分類頁（archive）卡片視覺統一（不動標題文字） ========== */

.archive .wp-block-post-featured-image{
  position:relative; width:100%; padding-top:56.25%;
  overflow:hidden; border-radius:12px;
}
.archive .wp-block-post-featured-image img{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:center; display:block;
}
.archive .wp-block-post{
  border-radius:16px; background:#fff;
  box-shadow:0 6px 22px rgba(0,0,0,.06);
  padding:12px; transition:transform .2s ease, box-shadow .2s ease;
}
.archive .wp-block-post:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 28px rgba(0,0,0,.08);
}
.archive .wp-block-post-title a{
  color:#001E50; text-decoration:none!important; font-weight:800; line-height:1.35;
}
.archive .wp-block-post-date{ color:#5b6b85; }

/* 隱藏首頁的預設大標題 “即時新聞” */
.home .entry-title {
  display: none !important;
  margin: 0 !important;
}

/* 縮短首頁頂端空間 */
.home .entry-content {
  margin-top: 2px !important;
}

/* 讓輪播本身更貼近上方內容 */
.hero-carousel {
  margin-top: 0 !important;
  padding-top: 0 !important;
}


/* ===== 單篇文章頁（single）完整整理版 ===== */

/* 1) 主內容區與右側欄 */
.single .site-main {
  width: calc(100% - 280px) !important;
  max-width: calc(100% - 280px) !important;
  float: left !important;
  padding-right: 36px !important;
  border-right: none !important;
  box-sizing: border-box;
}

.single .widget-area {
  width: 240px !important;
  max-width: 240px !important;
  float: right !important;
  padding-left: 24px !important;
  border-left: 1px solid #e5e5e5 !important;
  box-sizing: border-box;
}

/* 2) 單篇文章標題、日期、內文、圖片全部靠左並吃滿 */
.single .entry-header,
.single .entry-content,
.single .entry-summary,
.single .post-thumbnail,
.single .entry-footer {
  max-width: 100% !important;
  width: 100% !important;
  margin-left: 0 !important;
  padding-left: 0 !important;
  box-sizing: border-box;
}

.single .entry-title,
.single .entry-content p,
.single .entry-content figure,
.single .entry-content img,
.single .entry-content ul,
.single .entry-content ol,
.single .entry-content h2,
.single .entry-content h3,
.single .entry-content h4 {
  margin-left: 0 !important;
}

/* 3) 上方日期保留，放在標題下方 */
.single .entry-header .entry-meta,
.single .entry-header .posted-on,
.single .entry-header .entry-date,
.single .entry-header time,
.single .entry-meta {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  float: none !important;
  clear: both !important;
  margin: 14px 0 28px 0 !important;
  padding: 0 !important;
  font-size: 18px !important;
  line-height: 1.6 !important;
  color: #666 !important;
  text-align: left !important;
}

.single .entry-header .entry-meta a,
.single .entry-header .posted-on a,
.single .entry-header .entry-date a {
  color: #666 !important;
  text-decoration: none !important;
}

/* 4) 內文區寬度 */
.single .entry-content {
  max-width: 900px !important;
  width: 100% !important;
}

.single .entry-content img {
  max-width: 100% !important;
  height: auto !important;
  display: block;
}

/* 5) 底部 footer 不要再裂成左右兩塊 */
.single .entry-footer,
.single footer.entry-footer,
.single .post-footer {
  width: 100% !important;
  max-width: 900px !important;
  float: none !important;
  clear: both !important;
  margin: 40px 0 0 0 !important;
  padding: 0 !important;
  border-top: none !important;
}

/* 6) 底部重複日期隱藏，只留上方日期 */
.single .entry-footer .posted-on,
.single .entry-footer .entry-date,
.single .entry-footer time {
  display: none !important;
}

/* 7) 相關文章整塊恢復正常，不要偏右裂開 */
.single #jp-relatedposts,
.single .jp-relatedposts,
.single .related-posts,
.single section.related-posts {
  clear: both !important;
  float: none !important;
  width: 100% !important;
  max-width: 900px !important;
  margin: 48px 0 0 0 !important;
  padding: 28px 0 0 0 !important;
  border-top: 1px solid #e5e5e5 !important;
  box-sizing: border-box;
}

.single #jp-relatedposts h3,
.single .jp-relatedposts h3,
.single .related-posts h2,
.single .related-posts h3 {
  margin: 0 0 24px 0 !important;
  padding: 0 !important;
  float: none !important;
  text-align: left !important;
}

.single #jp-relatedposts .jp-relatedposts-items,
.single #jp-relatedposts .jp-relatedposts-post,
.single .jp-relatedposts .jp-relatedposts-items,
.single .jp-relatedposts .jp-relatedposts-post {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  clear: both !important;
  box-sizing: border-box;
}

/* 8) 清除殘留浮動 */
.single .site-main::after,
.single .entry-header::after,
.single .entry-content::after,
.single .entry-footer::after,
.single #jp-relatedposts::after {
  content: "";
  display: block;
  clear: both;
}

/* 9) 手機版恢復單欄 */
@media (max-width: 1100px) {
  .single .site-main,
  .single .widget-area {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  .single .widget-area {
    border-left: none !important;
    margin-top: 40px !important;
  }

  .single .entry-content,
  .single .entry-footer,
  .single #jp-relatedposts,
  .single .jp-relatedposts {
    max-width: 100% !important;
  }
}


/* ===== 單篇文章內容：文字與圖片統一規格 ===== */

/* 文章主內容寬度 */
.single .entry-content {
  max-width: 820px !important;
  width: 100% !important;
  box-sizing: border-box;
}

/* 文字區塊統一 */
.single .entry-content p,
.single .entry-content ul,
.single .entry-content ol,
.single .entry-content h2,
.single .entry-content h3,
.single .entry-content h4,
.single .entry-content blockquote {
  max-width: 820px !important;
  margin: 0 0 1.35em 0 !important;
  line-height: 1.9 !important;
  text-align: left !important;
  box-sizing: border-box;
}

/* 內文字體大小 */
.single .entry-content p,
.single .entry-content li {
  font-size: 18px !important;
  color: #222 !important;
}

/* 標題層級更穩定 */
.single .entry-content h2 {
  font-size: 30px !important;
  line-height: 1.4 !important;
  margin: 1.6em 0 0.7em 0 !important;
}

.single .entry-content h3 {
  font-size: 24px !important;
  line-height: 1.45 !important;
  margin: 1.4em 0 0.6em 0 !important;
}

/* 圖片與圖說統一 */
.single .entry-content figure,
.single .entry-content .wp-block-image,
.single .entry-content img {
  margin: 28px 0 !important;
  box-sizing: border-box;
}

.single .entry-content .wp-block-image img,
.single .entry-content figure img,
.single .entry-content p img {
  display: block !important;
  width: 100% !important;
  max-width: 820px !important;
  height: auto !important;
  margin: 0 !important;
}

/* 圖說 */
.single .entry-content figcaption,
.single .entry-content .wp-caption-text {
  max-width: 820px !important;
  margin-top: 8px !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  color: #666 !important;
  text-align: left !important;
}

/* 清掉多餘空段落 */
.single .entry-content p:empty {
  display: none !important;
}

/* 避免連續兩個換行把版面撐怪 */
.single .entry-content br + br {
  display: none;
}

/* 文章中的按鈕或奇怪區塊先不要太突兀 */
.single .entry-content .wp-block-button,
.single .entry-content .button,
.single .entry-content a.wp-block-button__link {
  margin: 24px 0 !important;
}