/**
 * 集光市 Jiguang Market — Archive / Single 樣板樣式
 * -------------------------------------------------------------
 * 列表頁、詳細頁、搜尋、404、麵包屑、分頁、分享、目錄、相關內容。
 */

/* --- 麵包屑 --- */
.jgs-breadcrumb { font-size: var(--jgs-font-body-sm); color: var(--jgs-muted); margin-bottom: 20px; }
.jgs-breadcrumb ol { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; }
.jgs-breadcrumb li:not(:last-child)::after { content: "›"; margin-left: 8px; color: var(--jgs-border); }
.jgs-breadcrumb a { color: var(--jgs-muted); }
.jgs-breadcrumb a:hover { color: var(--jgs-secondary); }

/* --- 列表頁頁首 --- */
.jgs-page-head { padding-block: 56px 8px; }
.jgs-page-head__title { font-size: var(--jgs-font-h1); margin-bottom: 12px; }
.jgs-page-head__intro { color: var(--jgs-muted); max-width: 60ch; font-size: var(--jgs-font-body-lg); }
.jgs-page-head__count { font-family: var(--jgs-font-label); font-size: var(--jgs-font-body-sm); color: var(--jgs-accent); margin-top: 12px; }

/* --- 篩選列 / 排序 --- */
.jgs-filter-bar { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; justify-content: space-between; padding-block: 24px; border-bottom: 1px solid var(--jgs-border); margin-bottom: 40px; }
.jgs-filter-group { display: flex; gap: 8px; flex-wrap: wrap; }
.jgs-filter-chip { font-family: var(--jgs-font-label); font-size: 14px; padding: 8px 16px; border-radius: var(--jgs-radius-pill); border: 1px solid var(--jgs-border); background: var(--jgs-white); color: var(--jgs-muted); }
.jgs-filter-chip.is-active, .jgs-filter-chip:hover { background: var(--jgs-primary); border-color: transparent; color: var(--jgs-primary-ink); }
.jgs-filter-select { font-family: var(--jgs-font-body); font-size: 14px; padding: 9px 14px; border-radius: var(--jgs-radius-pill); border: 1px solid var(--jgs-border); background: var(--jgs-white); color: var(--jgs-text); }

/* --- 通用列表格線 --- */
.jgs-archive-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.jgs-archive-grid--4 { grid-template-columns: repeat(4, 1fr); }
.jgs-archive-grid--2 { grid-template-columns: repeat(2, 1fr); }

/* --- 分頁 --- */
.jgs-pagination { margin-top: 56px; display: flex; justify-content: center; }
.jgs-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 42px; height: 42px; padding: 0 12px; border-radius: var(--jgs-radius-pill); border: 1px solid var(--jgs-border); margin: 0 4px; color: var(--jgs-secondary); font-family: var(--jgs-font-label); }
.jgs-pagination .page-numbers.current { background: var(--jgs-secondary); color: #fff; border-color: transparent; }
.jgs-pagination .page-numbers:hover:not(.current) { border-color: var(--jgs-secondary); }

/* --- 文章單頁 --- */
.jgs-single { padding-block: 40px var(--jgs-section-y); }
.jgs-single__head { max-width: var(--jgs-container-reading); margin: 0 auto 32px; text-align: center; }
.jgs-single__cats { margin-bottom: 16px; display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }
.jgs-single__title { font-size: var(--jgs-font-h1); margin-bottom: 18px; }
.jgs-single__excerpt { font-size: var(--jgs-font-body-lg); color: var(--jgs-muted); margin-bottom: 20px; }
.jgs-single__meta { display: flex; gap: 16px; justify-content: center; align-items: center; color: var(--jgs-muted); font-size: var(--jgs-font-body-sm); flex-wrap: wrap; }
.jgs-single__cover { max-width: var(--jgs-container-content); margin: 0 auto 40px; }
.jgs-single__cover img { width: 100%; border-radius: var(--jgs-radius-lg); aspect-ratio: 3/2; object-fit: cover; }

/* 內文閱讀寬度 + 排版元素 */
.jgs-prose { max-width: var(--jgs-container-reading); margin: 0 auto; font-size: var(--jgs-font-body-lg); }
.jgs-prose > * { margin-bottom: 1.4em; }
.jgs-prose h2 { font-size: var(--jgs-font-h3); margin-top: 1.8em; }
.jgs-prose h3 { font-size: var(--jgs-font-h4); margin-top: 1.4em; }
.jgs-prose img { border-radius: var(--jgs-radius-md); }
.jgs-prose figure { margin-inline: 0; }
.jgs-prose figcaption { font-size: var(--jgs-font-body-sm); color: var(--jgs-muted); text-align: center; margin-top: 8px; }
.jgs-prose blockquote { border-left: 3px solid var(--jgs-primary); padding-left: 24px; font-family: var(--jgs-font-heading); font-size: var(--jgs-font-h4); color: var(--jgs-secondary); font-style: normal; }
.jgs-prose ul, .jgs-prose ol { padding-left: 1.4em; }
.jgs-prose li { margin-bottom: 0.5em; }
.jgs-prose a { text-decoration: underline; text-underline-offset: 3px; }
.jgs-prose table { width: 100%; border-collapse: collapse; }
.jgs-prose th, .jgs-prose td { border: 1px solid var(--jgs-border); padding: 12px; text-align: left; }
.jgs-prose .wp-block-image { max-width: none; } /* 圖片可超出正文寬度 */

/* 提示框 */
.jgs-callout { background: var(--jgs-accent-soft); border-radius: var(--jgs-radius-md); padding: 20px 24px; color: var(--jgs-text); }

/* 目錄 */
.jgs-toc { background: var(--jgs-white); border: 1px solid var(--jgs-border); border-radius: var(--jgs-radius-md); padding: 20px 24px; margin-bottom: 32px; }
.jgs-toc__title { font-family: var(--jgs-font-label); font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--jgs-accent); margin-bottom: 10px; }
.jgs-toc ol { margin: 0; padding-left: 1.2em; display: grid; gap: 6px; font-size: var(--jgs-font-body-sm); }

/* 分享 */
.jgs-share { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.jgs-share__label { font-family: var(--jgs-font-label); font-size: 13px; color: var(--jgs-muted); }
.jgs-share__btn { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--jgs-border); background: var(--jgs-white); display: inline-flex; align-items: center; justify-content: center; font-family: var(--jgs-font-label); font-size: 12px; font-weight: 600; color: var(--jgs-secondary); cursor: pointer; }
.jgs-share__btn:hover { background: var(--jgs-primary); border-color: transparent; color: var(--jgs-primary-ink); }

/* 上一篇 / 下一篇 */
.jgs-postnav { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; max-width: var(--jgs-container-reading); margin: 56px auto 0; }
.jgs-postnav a { display: block; padding: 20px 24px; border: 1px solid var(--jgs-border); border-radius: var(--jgs-radius-md); background: var(--jgs-white); }
.jgs-postnav a:hover { border-color: var(--jgs-secondary); }
.jgs-postnav__dir { font-family: var(--jgs-font-label); font-size: 12px; color: var(--jgs-accent); text-transform: uppercase; }
.jgs-postnav__next { text-align: right; }

/* 作者介紹 */
.jgs-author { display: flex; gap: 18px; align-items: center; max-width: var(--jgs-container-reading); margin: 48px auto 0; padding: 24px; background: var(--jgs-white); border-radius: var(--jgs-radius-lg); }
.jgs-author img { width: 64px; height: 64px; border-radius: 50%; }

/* --- 相關內容 --- */
.jgs-related { padding-block: var(--jgs-section-y); background: var(--jgs-white); }
.jgs-related__title { font-size: var(--jgs-font-h3); margin-bottom: 32px; }

/* --- 市集詳細頁 --- */
.jgs-event-hero { position: relative; }
.jgs-event-hero img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.jgs-event-layout { display: grid; grid-template-columns: 1fr 360px; gap: 48px; align-items: start; padding-block: 48px var(--jgs-section-y); }
.jgs-event-title { font-size: var(--jgs-font-h1); margin-bottom: 8px; }
.jgs-event-subtitle { color: var(--jgs-muted); font-size: var(--jgs-font-body-lg); margin-bottom: 20px; }
.jgs-event-tags { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 28px; }
.jgs-event-section { margin-bottom: 40px; }
.jgs-event-section h2 { font-size: var(--jgs-font-h3); margin-bottom: 16px; }
.jgs-event-highlights { list-style: none; padding: 0; display: grid; gap: 10px; }
.jgs-event-highlights li { padding-left: 26px; position: relative; }
.jgs-event-highlights li::before { content: "✦"; color: var(--jgs-primary); position: absolute; left: 0; }

/* Sticky 資訊欄 */
.jgs-event-aside { position: sticky; top: calc(var(--jgs-header-h) + 20px); background: var(--jgs-white); border: 1px solid var(--jgs-border); border-radius: var(--jgs-radius-lg); padding: 28px; box-shadow: var(--jgs-shadow-card); }
.jgs-event-aside__row { display: flex; gap: 12px; padding-block: 14px; border-bottom: 1px solid var(--jgs-border); }
.jgs-event-aside__row:last-of-type { border-bottom: 0; }
.jgs-event-aside__label { font-family: var(--jgs-font-label); font-size: 12px; color: var(--jgs-muted); min-width: 56px; }
.jgs-event-aside__value { font-size: var(--jgs-font-body-sm); color: var(--jgs-text); }
.jgs-event-aside__actions { display: grid; gap: 10px; margin-top: 20px; }
.jgs-event-aside__actions .jgs-btn { width: 100%; }
.jgs-event-ended { background: var(--jgs-secondary); color: #fff; text-align: center; padding: 14px; border-radius: var(--jgs-radius-md); margin-bottom: 20px; font-weight: 600; }

/* 攤商招募區塊 */
.jgs-vendor-callout { background: var(--jgs-accent-soft); border: 1px solid var(--jgs-border); border-radius: var(--jgs-radius-lg); padding: 28px 32px; }
.jgs-vendor-callout h2 { margin: 12px 0 10px; }
.jgs-vendor-callout__meta { display: flex; flex-wrap: wrap; gap: 8px 24px; color: var(--jgs-muted); font-size: var(--jgs-font-body-sm); margin-bottom: 18px; }

/* 品牌牆 */
.jgs-brand-mini-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 16px; }
.jgs-brand-mini { text-align: center; }
.jgs-brand-mini img { aspect-ratio: 1; object-fit: cover; border-radius: var(--jgs-radius-md); margin-bottom: 8px; }
.jgs-brand-mini span { font-size: var(--jgs-font-body-sm); }

/* 手機底部固定 CTA */
.jgs-event-sticky-mobile { display: none; }

/* --- 品牌詳細頁 --- */
.jgs-brand-cover { position: relative; }
.jgs-brand-cover img { width: 100%; aspect-ratio: 3/2; object-fit: cover; max-height: 520px; }
.jgs-brand-head { max-width: var(--jgs-container-content); margin: -80px auto 0; position: relative; background: var(--jgs-background); border-radius: var(--jgs-radius-lg); padding: 40px; }
.jgs-brand-head__name { font-size: var(--jgs-font-h1); margin-bottom: 4px; }
.jgs-brand-head__en { font-family: var(--jgs-font-en-display); color: var(--jgs-muted); letter-spacing: .1em; margin-bottom: 16px; }
.jgs-brand-social { display: flex; gap: 12px; margin-top: 20px; flex-wrap: wrap; }

/* 圖庫 */
.jgs-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; }
.jgs-gallery img { aspect-ratio: 1; object-fit: cover; border-radius: var(--jgs-radius-md); }

/* --- 人物專訪詳細 --- */
.jgs-interview-hero { max-width: var(--jgs-container-content); margin: 0 auto; padding-block: 40px; display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.jgs-interview-hero img { width: 100%; aspect-ratio: 4/5; object-fit: cover; border-radius: var(--jgs-radius-lg); }
.jgs-interview-hero__name { font-size: var(--jgs-font-h1); margin-bottom: 8px; }
.jgs-interview-hero__role { color: var(--jgs-accent); font-family: var(--jgs-font-label); margin-bottom: 20px; }

/* --- 搜尋結果 --- */
.jgs-search-group { margin-bottom: 48px; }
.jgs-search-group__title { font-size: var(--jgs-font-h4); margin-bottom: 20px; padding-bottom: 10px; border-bottom: 1px solid var(--jgs-border); display: flex; align-items: center; gap: 10px; }
.jgs-search-group__count { font-family: var(--jgs-font-label); font-size: 13px; color: var(--jgs-muted); }
.jgs-search-item { display: grid; grid-template-columns: 140px 1fr; gap: 20px; padding: 16px 0; border-bottom: 1px solid var(--jgs-border); }
.jgs-search-item img { aspect-ratio: 4/3; object-fit: cover; border-radius: var(--jgs-radius-md); }
.jgs-search-item__type { font-family: var(--jgs-font-label); font-size: 12px; color: var(--jgs-accent); text-transform: uppercase; }
.jgs-search-item__title { font-size: var(--jgs-font-h4); margin: 4px 0 6px; }

/* --- 404 --- */
.jgs-404 { text-align: center; padding-block: 100px; max-width: 640px; margin: 0 auto; }
.jgs-404__title { font-size: var(--jgs-font-display); color: var(--jgs-primary); }
.jgs-404__text { font-size: var(--jgs-font-body-lg); color: var(--jgs-muted); margin: 16px 0 32px; white-space: pre-line; }
.jgs-404__actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

/* --- 響應式 --- */
@media (max-width: 1024px) {
	.jgs-archive-grid, .jgs-archive-grid--4 { grid-template-columns: repeat(2, 1fr); }
	.jgs-event-layout { grid-template-columns: 1fr; }
	.jgs-event-aside { position: static; }
	.jgs-interview-hero { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
	.jgs-archive-grid, .jgs-archive-grid--4, .jgs-archive-grid--2 { grid-template-columns: 1fr; }
	.jgs-postnav { grid-template-columns: 1fr; }
	.jgs-search-item { grid-template-columns: 100px 1fr; gap: 14px; }
	.jgs-brand-head { margin-top: -40px; padding: 24px; }
	/* 手機底部固定 CTA 顯示 */
	.jgs-event-sticky-mobile {
		display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: var(--jgs-z-header);
		background: var(--jgs-white); border-top: 1px solid var(--jgs-border); padding: 12px 16px; gap: 10px;
	}
	.jgs-event-sticky-mobile .jgs-btn { flex: 1; }
}
