/* =========================================
   newslist.php — 列表頁
   ========================================= */

.news-page-hero {
    padding: 2.5rem 0 1.5rem;
    border-bottom: 1px solid #e3d8c8;
}
.news-page-hero h1 {
    color: #926137;
    font-size: 1.8rem;
    font-weight: 700;
    letter-spacing: .05em;
    margin: 0;
}
.news-filter-bar {
    background: #fff;
    border-bottom: 1px solid #eee;
    padding: .75rem 0;
}
.news-filter-bar select {
    border: 1px solid #C69C6D;
    color: #736357;
    border-radius: 6px;
    padding: .3rem .75rem;
    font-size: .9rem;
    background-color: #fff;
}
.news-item {
    display: flex;
    gap: 1.25rem;
    padding: 1.2rem;
    border-bottom: 1px solid #e8ddd0;
    position: relative;
    text-decoration: none;
    transition: background .2s;
}
.news-item:first-child { border-top: 1px solid #e8ddd0; }
.news-item:hover { background: #faf6f0; }
.news-item .news-thumb {
    flex: 0 0 200px;
    width: 200px;
    height: 113px; /* 16:9 */
    overflow: hidden;
    border-radius: 8px;
    background: #f5ede1;
}
.news-item .news-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .35s;
}
.news-item:hover .news-thumb img { transform: scale(1.04); }
.news-item .news-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
}
.news-item .news-meta {
    display: flex;
    align-items: center;
    gap: .6rem;
    margin-bottom: .4rem;
    flex-wrap: wrap;
}
.news-title {
    font-size: 1.2rem;
    font-weight: 700;
    color: #736357;
    margin-bottom: .35rem;
    line-height: 1.45;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.news-subtitle {
    font-size: .875rem;
    color: #9e8878;
    line-height: 1.55;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin: 0;
}
.news-item a.stretched-link::after { border-radius: 0; }
.pager .page-link {
    color: #926137;
    border-color: #e3d8c8;
}
ul.pager > li.page-item { list-style: none; }
.pager .page-item.active .page-link {
    background-color: #C69C6D;
    border-color: #C69C6D;
    color: #fff;
}
.pager .page-link:hover {
    background-color: #F4EFE6;
    color: #926137;
}

/* =========================================
   共用元件 (列表頁 & 內容頁)
   ========================================= */

span.news-cat-badge {
    display: inline-block;
    background: #F4EFE6;
    color: #926137;
    border: 1px solid #C69C6D;
    border-radius: 20px;
    font-size: .78rem;
    padding: .7rem .55rem;
    font-weight: 500;
}
.news-date {
    font-size: .8rem;
    color: #a89070;
}

/* =========================================
   news.php — 內容頁
   ========================================= */

.news-detail-hero {
    background-color: #F4EFE6;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #e3d8c8;
}
.news-detail-hero .breadcrumb {
    background: transparent;
    padding: 0;
    margin-bottom: 0;
    font-size: .85rem;
}
.news-detail-hero .breadcrumb-item a {
    color: #926137;
    text-decoration: none;
}
.news-detail-hero .breadcrumb-item.active { color: #9e8878; }
.news-detail-hero .breadcrumb-item + .breadcrumb-item::before { color: #C69C6D; }
.news-detail-title {
    color: #736357;
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.4;
    text-align: left;
    margin: .75rem 0 .5rem;
}
.news-detail-date {
    color: #a89070;
    font-size: .85rem;
    margin-bottom: 0;
}
.news-detail-img {
    width: 100%;
    max-height: 460px;
    object-fit: cover;
    border-radius: 12px;
    margin-bottom: 2rem;
    box-shadow: 0 4px 18px rgba(198,156,109,.18);
}
.news-detail-body {
    color: #736357;
    font-size: 1rem;
    line-height: 1.85;
}
.news-detail-body img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    margin: .5rem 0;
}
.news-back-btn {
    display: inline-block;
    color: #926137;
    border: 1px solid #C69C6D;
    border-radius: 24px;
    padding: .45rem 1.4rem;
    font-size: .9rem;
    text-decoration: none;
    transition: background .2s, color .2s;
}
.news-back-btn:hover {
    background: #C69C6D;
    color: #fff;
    text-decoration: none;
}

/* =========================================
   RWD
   ========================================= */
   
   @media (min-width: 737px) {   
       span.news-cat-badge,
       span.news-date {
           font-size: 0.8rem !important;
           line-height: 0 !important;
       }
   }

@media (max-width: 576px) {
    .news-page-hero h1 { font-size: 1.4rem; }
    .news-item .news-thumb {
        flex: 0 0 110px;
        width: 110px;
        height: 62px;
    }
    .news-title {
        font-size: .95rem;
        white-space: normal;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
    .news-detail-title { font-size: 1.3rem; }
    .news-detail-img { max-height: 240px; }
}

/* =========================================
   首頁最新消息區塊
   ========================================= */
.home-section-title {
    font-size: 1.75rem;
    font-weight: 700;
    color: #736357;
    text-align: center;
    padding: .75rem 0;
    margin-bottom: .75rem;
}
.home-news-list {
    list-style: none;
    padding: 0;
    margin: 0;
    border-top: 2px solid #C69C6D;
}
.home-news-item {
    list-style: none;
    border-bottom: 1px solid #e8ddd0;
}
.home-news-item a {
    display: flex;
    align-items: baseline;
    gap: 1rem;
    padding: .7rem .25rem;
    text-decoration: none;
    color: #736357;
    transition: color .2s;
}
.home-news-item a:hover {
    color: #926137;
    background: #faf6f0;
    text-decoration: none;
}
.home-news-date {
    flex: 0 0 auto;
    font-size: .8rem;
    color: #a89070;
    white-space: nowrap;
}
.home-news-title-text {
    flex: 1;
    font-size: .95rem;
    line-height: 1.45;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.home-news-more {
    display: inline-block;
    color: #926137;
    border: 1px solid #C69C6D;
    border-radius: 24px;
    padding: .45rem 2rem;
    font-size: .9rem;
    text-decoration: none;
    transition: background .2s, color .2s;
}
.home-news-more:hover {
    background: #C69C6D;
    color: #fff;
    text-decoration: none;
}
@media (max-width: 576px) {
    .home-section-title { font-size: 1.4rem; }
    .home-news-title-text {
        white-space: normal;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
}