﻿/* ==========================================================================
   APHA — News channel page (news.aspx)
   Version: 20261111.2  (bump on every change!)
   Scope  : .ap-news-page only — does NOT alter site.css / other pages.
   Tokens : inherits the design system declared in css/site.css.
   Zero external dependencies.
   ========================================================================== */

.ap-news-page .ap-page-hero{padding:52px 0 46px}
.ap-news-kicker{
  display:inline-flex;align-items:center;gap:8px;margin-bottom:10px;
  color:rgba(255,255,255,.72);font-size:.75rem;font-weight:700;
  letter-spacing:.18em;text-transform:uppercase;
}
.ap-news-kicker::before{content:"";width:22px;height:2px;background:var(--apha-green)}

.ap-news-section{padding-top:34px}

/* ---------- channel rail ---------- */
.ap-channels{
  display:flex;gap:10px;overflow-x:auto;overscroll-behavior-x:contain;
  margin:0 0 4px;padding:4px 2px 14px;
  scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
}
.ap-channels::-webkit-scrollbar{height:6px}
.ap-channels::-webkit-scrollbar-thumb{background:var(--apha-line);border-radius:999px}
.ap-channels::-webkit-scrollbar-track{background:transparent}

.ap-chan{
  flex:none;display:inline-flex;align-items:center;gap:9px;
  min-height:44px;padding:9px 16px;
  border:1px solid var(--apha-line);border-radius:999px;background:#fff;
  color:var(--apha-ink);font-size:.9rem;font-weight:600;line-height:1;
  scroll-snap-align:start;box-shadow:var(--apha-shadow-sm);
  transition:transform .18s var(--apha-ease),box-shadow .18s var(--apha-ease),
             border-color .18s var(--apha-ease),color .18s var(--apha-ease);
}
.ap-chan:hover{
  transform:translateY(-1px);border-color:var(--apha-primary);
  color:var(--apha-primary-dark);box-shadow:var(--apha-shadow-md);
}
.ap-chan:active{transform:translateY(0)}
.ap-chan.is-active{
  border-color:transparent;color:#fff;
  background-image:linear-gradient(135deg,var(--apha-primary) 0%,var(--apha-primary-dark) 100%);
  box-shadow:0 10px 24px -12px rgba(42,122,229,.75);
}
.ap-chan:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(42,122,229,.28)}
.ap-chan-label{white-space:nowrap}
.ap-chan-count{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:24px;height:22px;padding:0 7px;border-radius:999px;
  background:var(--apha-bg-soft);color:var(--apha-primary-dark);
  font-size:.72rem;font-weight:700;font-variant-numeric:tabular-nums;
}
.ap-chan.is-active .ap-chan-count{background:rgba(255,255,255,.2);color:#fff}

/* ---------- result meta ---------- */
.ap-news-meta{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  margin-bottom:30px;padding:10px 0 18px;
  border-bottom:1px solid var(--apha-line-soft);
}
.ap-news-meta-count{color:var(--apha-muted);font-size:.86rem;letter-spacing:.02em}

/* ---------- cards ---------- */
/* v20261111.2: 图片尺寸对齐 conferences.aspx 列表(1248/386 宽幅);
   直接作用于 #apNewsGrid, 同时覆盖 Load More 由 site.js 追加的卡片(无 --conf 类) */
.ap-news-page #apNewsGrid .ap-card-media{aspect-ratio:1248/386}
.ap-news-page #apNewsGrid .ap-card-media--ph{font-size:.95rem}
.ap-news-page .ap-card-media img{
  width:100%;height:100%;object-fit:cover;
  transition:transform .5s var(--apha-ease);
}
.ap-news-page .ap-card:hover .ap-card-media img{transform:scale(1.04)}
.ap-news-page .ap-card-title{
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;
}
.ap-news-page .ap-card-title a{color:inherit}
.ap-news-page .ap-card-title a:hover{color:var(--apha-primary-dark)}
.ap-news-page .ap-card-title a:focus-visible{
  outline:none;border-radius:4px;box-shadow:0 0 0 3px rgba(42,122,229,.28);
}
.ap-news-page .ap-card-text{
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;
  margin-bottom:0;
}

/* ---------- empty state ---------- */
.ap-news-empty{
  grid-column:1/-1;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
  min-height:320px;padding:56px 24px;text-align:center;
  background:#fff;border:1px dashed var(--apha-line);border-radius:18px;
  color:var(--apha-muted);
}
.ap-news-empty svg{width:46px;height:46px;color:var(--apha-primary);opacity:.65}
.ap-news-empty h3{
  max-width:36ch;margin:0;color:var(--apha-ink);
  font-family:var(--apha-font-display);font-size:1.25rem;font-weight:400;
}
.ap-news-empty .ap-btn{margin-top:4px}

/* ---------- pager / load more ---------- */
.ap-news-page .ap-pager-gap{
  display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;color:var(--apha-muted);
}
.ap-news-page .ap-loadmore-wrap{margin-top:34px}

/* ---------- responsive ---------- */
@media (max-width:900px){
  .ap-news-section{padding-top:26px}
  .ap-news-meta{margin-bottom:24px}
}
@media (max-width:620px){
  .ap-news-page .ap-page-hero{padding:44px 0 38px}
  .ap-channels{gap:8px}
  .ap-chan{padding:8px 13px;font-size:.86rem}
  .ap-news-empty{min-height:240px;padding:40px 18px}
}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  .ap-chan,
  .ap-news-page .ap-card-media img{transition:none}
  .ap-news-page .ap-card:hover .ap-card-media img{transform:none}
}
