/* MCF 內容維護 — 列表頁樣式（前綴 mcfc-）
 *
 * 1.0.6 基礎風格統一：/events/ 與 /press/ 對齊之基準＝/毛sir-的戲劇人生/ 文章頁的設計語彙：
 *   容器白卡（rounded-lg 8px ＋ shadow-lg）
 *   標題區紅 banner（#991b1b、白字、居中、上下 32px）
 *   主標 36px/700、副標 18px
 *   分類 chips：圓角 4px、選中 #dc2626、未選 #e5e7eb
 * 註：模板的標題區已由 <header> 改為 <div class="mcfc-head">，
 *     避免被主題的 `header {}` 元素選擇器（紅色漸層＋sticky＋白字）命中。
 */

.mcfc-wrap {
    /* 設計語彙（取自基準文章頁 Tailwind 實際取值） */
    --mcf-radius: 8px;      /* rounded-lg */
    --mcf-radius-sm: 4px;   /* rounded    */
    --mcf-banner: #991b1b;  /* bg-red-800 */
    --mcf-banner-hi: #dc2626; /* bg-red-600 */
    --mcf-ink: #1f2937;     /* text-gray-800 */
    --mcf-line: #e5e7eb;    /* bg-gray-200 */
    --mcf-muted: #6b7280;   /* text-gray-500 */
    --mcf-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1);
}

/* 提高特異性：蓋過主題 `.container` 的 padding/margin */
.mcfc-wrap.container {
    max-width: var(--container, 1200px);
    margin: 16px auto 72px;
    padding: 0 20px;
}

/* 白卡外框 */
.mcfc-shell {
    background: #fff;
    border-radius: var(--mcf-radius);
    box-shadow: var(--mcf-shadow);
    overflow: hidden;
}

/* 標題區＝紅 banner（同時壓住主題 `header {}` 的 sticky／漸層，容錯舊模板） */
.mcfc-head,
header.mcfc-head {
    position: static;
    z-index: auto;
    background: var(--mcf-banner);
    color: #fff;
    text-align: center;
    padding: 32px 20px;
}

.mcfc-title {
    font-size: clamp(26px, 3.2vw, 36px);
    font-weight: 700;
    line-height: 1.25;
    color: #fff;
    margin: 0;
    letter-spacing: .04em;
}

.mcfc-lead {
    color: rgba(255, 255, 255, .88);
    font-size: 18px;
    line-height: 1.5;
    margin: 8px 0 0;
}

/* 白卡內容區 */
.mcfc-body {
    padding: 24px;
}

/* 分類 chips（基準頁為圓角按鈕，非藥丸）
   容器用 <div> 而非 <nav>：主題的 `nav {}` 規則會把 nav 定位到頁首導航位置 */
.mcfc-chips {
    position: static;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    margin: 0 0 24px;
}

/* a.mcfc-chip 提高特異性：壓過主題 `.current-menu-item > a` 的金色 */
.mcfc-chips a.mcfc-chip {
    display: inline-block;
    padding: 8px 16px;
    border: 1px solid var(--mcf-line);
    border-radius: var(--mcf-radius-sm);
    background: var(--mcf-line);
    color: #374151;
    font-size: 14px;
    text-decoration: none;
    transition: background .15s ease, color .15s ease;
}

.mcfc-chips a.mcfc-chip:hover {
    background: #d1d5db;
}

.mcfc-chips a.mcfc-chip--on {
    background: var(--mcf-banner-hi);
    border-color: var(--mcf-banner-hi);
    color: #fff;
}

/* 卡片網格：桌面 3 欄／平板 2 欄／手機 1 欄（斷點沿用主題 1020px、620px） */
.mcfc-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}

.mcfc-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--mcf-line);
    border-radius: var(--mcf-radius);
    box-shadow: 0 4px 12px rgba(0, 0, 0, .06);
    overflow: hidden;
    text-decoration: none;
    color: inherit;
}

.mcfc-card__thumb {
    display: block;
    aspect-ratio: 16 / 10;
    background: var(--secondary-cream, #F8F5F0);
    overflow: hidden;
}

.mcfc-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .3s ease;
}

.mcfc-card:hover .mcfc-card__thumb img {
    transform: scale(1.04);
}

.mcfc-card__nothumb {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    color: rgba(158, 27, 27, .55);
    font-size: 15px;
    letter-spacing: .12em;
}

.mcfc-card__body {
    display: block;
    padding: 16px 18px 20px;
}

.mcfc-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 8px;
}

.mcfc-badge {
    background: var(--mcf-banner);
    color: #fff;
    font-size: 12px;
    line-height: 1;
    padding: 5px 10px;
    border-radius: var(--mcf-radius-sm);
    text-decoration: none;
}

.mcfc-card__title {
    font-size: 18px;
    line-height: 1.5;
    font-weight: 600;
    margin: 0 0 8px;
    color: var(--mcf-ink);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.mcfc-card__title a {
    color: inherit;
    text-decoration: none;
}

.mcfc-date {
    font-size: 13px;
    color: var(--mcf-muted);
}

.mcfc-excerpt {
    font-size: 14px;
    line-height: 1.7;
    color: rgba(0, 0, 0, .68);
    margin: 10px 0 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* 媒體報導卡：整卡外鏈 */
.mcfc-card--media .mcfc-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 6px;
    font-size: 13px;
    color: var(--mcf-muted);
}

.mcfc-source {
    color: var(--mcf-banner);
    font-weight: 600;
}

.mcfc-ext {
    color: rgba(0, 0, 0, .38);
}

/* 媒體報導卡摘要 */
.mcfc-card--media .mcfc-card__excerpt {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin: 6px 0 0;
    font-size: 14px;
    line-height: 1.6;
    color: rgba(0, 0, 0, .68);
}

.mcfc-empty {
    color: var(--mcf-muted);
    padding: 32px 0;
    text-align: center;
}

/* ===== 1.0.8（N-136）：/press/ 無圖條列＋媒體過濾 ===== */
.mcfc-filter {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0 0 20px;
}

.mcfc-filter__label {
    font-size: 13px;
    color: var(--mcf-muted);
    margin-right: 2px;
}

.mcfc-filter__item {
    display: inline-block;
    padding: 6px 14px;
    border: 1px solid var(--mcf-line);
    border-radius: var(--mcf-radius-sm);
    background: #fff;
    color: var(--mcf-ink);
    font-size: 14px;
    line-height: 1.4;
    text-decoration: none;
    transition: background .15s, border-color .15s, color .15s;
}

.mcfc-filter__item:hover {
    border-color: var(--mcf-banner-hi);
    color: var(--mcf-banner);
}

.mcfc-filter__item.is-active {
    background: var(--mcf-banner-hi);
    border-color: var(--mcf-banner-hi);
    color: #fff;
}

.mcfc-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.mcfc-list__item {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 12px;
    padding: 14px 0;
    border-bottom: 1px solid var(--mcf-line);
}

.mcfc-list__item:first-child {
    border-top: 1px solid var(--mcf-line);
}

.mcfc-list__date {
    flex: 0 0 auto;
    min-width: 7.5em;
    font-size: 13px;
    color: var(--mcf-muted);
    white-space: nowrap;
}

.mcfc-list__source {
    flex: 0 0 auto;
    padding: 1px 8px;
    border: 1px solid currentColor;
    border-radius: var(--mcf-radius-sm);
    color: var(--mcf-banner);
    font-size: 12px;
    line-height: 1.6;
    white-space: nowrap;
}

.mcfc-list__title {
    flex: 1 1 12em;
    min-width: 0;
    color: var(--mcf-ink);
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5;
    text-decoration: none;
}

.mcfc-list__title:hover {
    color: var(--mcf-banner);
    text-decoration: underline;
}

.mcfc-list__title .mcfc-ext {
    margin-left: 4px;
    font-size: 13px;
    font-weight: 400;
}

/* 分頁 */
.mcfc-pager {
    margin-top: 32px;
}

/* 主題 mainV1.css 對 nav 全域絕對定位（top:90px; right:30px）；
   the_posts_pagination() 輸出的是 <nav class="navigation pagination">，需復位回文流 */
.mcfc-pager nav {
    position: static;
    top: auto;
    right: auto;
    margin-top: 0;
}

.mcfc-pager .nav-links {
    display: flex;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
}

.mcfc-pager .page-numbers {
    display: inline-block;
    min-width: 38px;
    padding: 8px 12px;
    text-align: center;
    border-radius: var(--mcf-radius-sm);
    border: 1px solid var(--mcf-line);
    color: var(--mcf-ink);
    text-decoration: none;
}

.mcfc-pager .page-numbers.current {
    background: var(--mcf-banner);
    border-color: var(--mcf-banner);
    color: #fff;
}

@media (max-width: 1020px) {
    .mcfc-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px;
    }
}

@media (max-width: 620px) {
    .mcfc-wrap.container {
        margin: 16px auto 56px;
        padding: 0 16px;
    }

    .mcfc-head {
        padding: 24px 16px;
    }

    .mcfc-lead {
        font-size: 15px;
    }

    .mcfc-body {
        padding: 16px;
    }

    .mcfc-chips {
        gap: 8px;
        margin-bottom: 20px;
    }

    .mcfc-grid {
        grid-template-columns: 1fr;
    }

    .mcfc-filter {
        gap: 6px;
    }

    .mcfc-list__item {
        /* 1.0.11（N-140）：原本改 column，但 .mcfc-list__title 的 flex:1 1 12em 在 column 下
           flex-basis 由寬度基準轉為高度基準 → 標題盒恆 192px（實際文字僅 2~5 行），
           320px 寬時每條實測 270px（≈ 1024px 的 4.9 倍）。改回 row + wrap：
           日期與媒體 badge 同行，標題獨佔第二行（320px 實測 125px）。 */
        flex-wrap: wrap;
        gap: 4px;
        padding: 12px 0;
    }

    .mcfc-list__title {
        flex: 1 1 100%;
    }

    .mcfc-list__date {
        min-width: 0;
    }
}