/* 课本库 · 官网补充规则。
   设计稿的 home.css / search.css 保持原样（与顶层 web/ 静态快照逐字节一致）：
   这里补动态内容样式，并为 Base Layout 的公共页脚统一覆盖两页旧规则。 */
[hidden] { display: none !important; }

/* 真实筛选值数量不定，允许 chips 换行；选项少时布局与设计稿一致。 */
.chips { flex-wrap: wrap; row-gap: 8px; }
.chip { position: relative; cursor: pointer; }
.chip input[type="radio"] {
  position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; pointer-events: none;
}
.chip:focus-within { outline: 2px solid var(--red-light); outline-offset: 2px; }

/* 有真实封面时图片铺满色块；加载失败由 site-extra.js 还原矢量封面。 */
.cover { position: relative; }
.cover-photo {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; display: block;
}
.cover-subject, .book-name, .book-meta {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* ---- Base Layout 公共页脚：两页统一使用检索页的简化版 ----
   本文件在 home.css / search.css 之后加载，以同优先级覆盖两页旧规则。
   首页的 .footer-col / .footer-watermark 因 DOM 中不再出现成为死规则，
   两份设计稿 CSS 无需改动，仍与顶层 web/ 静态快照逐字节一致。 */
.site-footer { gap: 28px; padding: 56px 120px 32px; }
.footer-top { align-items: center; justify-content: space-between; flex-wrap: nowrap; gap: 0; }
.footer-brand { flex: none; flex-direction: row; align-items: center; gap: 16px; }
.footer-brand-name { font-size: 22px; line-height: 32px; }
.footer-tagline { font-size: 13px; line-height: 19px; }
.footer-source { font-size: 12px; line-height: 17px; color: var(--ink-3); }
.footer-bottom { flex-direction: row; align-items: center; justify-content: space-between; gap: 24px; }

@media (max-width: 1439px) {
  .site-footer { padding: 56px 64px 32px; }
  .footer-top { gap: 0; }
}
@media (max-width: 1023px) {
  .site-footer { padding: 48px 32px 32px; }
  .footer-top { flex-wrap: nowrap; gap: 0; }
  .footer-brand { flex: none; }
}
@media (max-width: 767px) {
  .site-footer { padding: 40px 24px 28px; gap: 24px; }
  .footer-top { flex-direction: column; align-items: flex-start; gap: 16px; }
  .footer-bottom { flex-direction: column; align-items: flex-start; gap: 8px; }
}

/* ---- 封面放大预览 ----
   dialog 位于 #site-main 之外，htmx 片段交换不会销毁它；卡片内是 cover 裁切，
   预览用 contain 显示完整封面。只给真实封面加 zoom 光标，矢量占位无像素可放大。 */
.cover.is-zoomable { cursor: zoom-in; }
.cover.is-zoomable:focus-visible { outline: 2px solid var(--red); outline-offset: 3px; }

.cover-preview {
  /* fixed + inset:0 让弹层以视口为基准居中。若用 relative/absolute，
     showModal() 把焦点交给关闭按钮时浏览器会按文档坐标把页面滚回顶部。 */
  position: fixed; inset: 0;
  width: min(92vw, 860px); max-width: none; max-height: 90vh; overflow: auto;
  margin: auto; padding: 0; border: 0; border-radius: 3px;
  background: var(--paper-card); color: var(--ink);
  box-shadow: 0 24px 64px rgba(28, 28, 26, .28);
}
.cover-preview::backdrop { background: rgba(28, 28, 26, .72); }
.preview-photo {
  display: block; width: 100%; max-height: 76vh;
  object-fit: contain; background: var(--paper);
}
.preview-close {
  position: absolute; top: 12px; right: 12px; z-index: 1;
  width: 36px; height: 36px; padding: 0;
  border: 1px solid var(--line); border-radius: 2px;
  background: var(--paper-card); color: var(--ink);
  font: 22px/1 var(--font-sans); cursor: pointer;
}
.preview-close:hover { color: var(--red); }
.preview-meta {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 16px;
  padding: 16px 24px 20px; border-top: 1px solid var(--line);
}
.preview-title { font-family: var(--font-serif); font-weight: 700; font-size: 18px; line-height: 26px; }
.preview-sub { font-size: 12px; line-height: 17px; color: var(--ink-3); }
@media (max-width: 767px) {
  .cover-preview { width: calc(100vw - 32px); }
  .preview-meta { padding: 14px 16px 18px; }
}

/* ---- 移除检索页 intro 标题区后的顶部留白 ----
   search.css 里 .search-section 是 padding: 0 120px，原本由 intro 的下留白
   撑开；整段删掉后面板会贴住页头分隔线。只覆盖 padding-top（不能用简写，
   否则会重置各断点的左右内边距），数值沿用原 intro 的上留白。
   search.css 保持与顶层 web/ 静态快照逐字节一致。 */
.search-section { padding-top: 56px; }
@media (max-width: 1023px) { .search-section { padding-top: 48px; } }
@media (max-width: 767px) { .search-section { padding-top: 40px; } }