/*
 * Chỉnh giao diện trang công khai (sân thử, phương án 1).
 * Chỉ nạp ở template công khai, sau styles.css — không đụng trang quản trị/trình đọc.
 * Theo DESIGN_SYSTEM.md: không thêm đổ bóng, gradient hay khung mới; chỉ chỉnh màu, bố cục, chữ.
 */

:root {
  --public-brand: #8f131a;
  --public-brand-hover: #74101a;
}

/* ---- Menu chính (desktop) ---- */
.public-primary-nav {
  display: flex;
  align-items: center;
  gap: 22px;
}

.shared-header .public-primary-nav .public-primary-nav__link {
  padding: 10px 0;
  border-bottom: 1px solid transparent;
  color: var(--ui-text-strong);
  font-family: var(--font-heading);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: 0.01em;
  text-decoration: none;
  white-space: nowrap;
}

.shared-header .public-primary-nav .public-primary-nav__link:hover,
.shared-header .public-primary-nav .public-primary-nav__link:focus-visible {
  color: var(--public-brand);
}

.shared-header .public-primary-nav .public-primary-nav__link[aria-current="page"] {
  color: var(--public-brand);
  border-bottom-color: currentColor;
}

@media (max-width: 1024px) {
  .public-primary-nav {
    display: none;
  }
}

/* ---- Menu chính (điện thoại): cùng nhịp với nút "Tủ sách" ---- */
.topbar-mobile-primary-link {
  display: flex;
  align-items: center;
  min-height: 46px;
  padding: 6px 0;
  color: var(--ui-text);
  font-family: var(--font-heading);
  font-size: 15px;
  text-decoration: none;
}

.topbar-mobile-primary-link[aria-current="page"] {
  color: var(--public-brand);
}

/* ---- Trang chủ: h1 bọc logo đầu trang, không đổi bố cục ---- */
.public-masthead__title {
  display: contents;
}

/* ---- Tiêu đề mục không bị bó hẹp (styles.css để 17.5ch nên tên mục dài bị gãy dòng) ---- */
:root {
  --listing-section-secondary-title-measure: 32ch;
}

body .bookshelf-home-copy--centered {
  max-width: min(100%, 60ch);
}

body[data-page-kind="detail"] .detail-similar-heading {
  max-width: none;
}

/* ---- Thẻ sách: tên sách thẳng hàng, nút "Mở sách" nằm cùng một đường ----
   styles.css có bộ chọn lồng tới (0,4,1) cho thẻ sách, nên ở đây lặp class để thắng mà không dùng !important. */
html body .book-grid.book-grid.book-grid {
  align-items: stretch;
}

html body .book-grid > article.book-card.book-card.book-card {
  grid-template-rows: auto 1fr;
}

html body .book-grid > article.book-card.book-card .book-card__body.book-card__body.book-card__body {
  display: flex;
  flex-direction: column;
  align-items: center;
}

html body .book-grid > article.book-card .book-card__text {
  order: 1;
  padding-top: 8px;
}

html body .book-grid > article.book-card .book-card__badge-row {
  order: 2;
  margin-top: 6px;
}

html body .book-grid > article.book-card .book-card__cta {
  order: 3;
  margin-top: auto;
}

/* ---- Chi tiết sách ---- */
body[data-page-kind="detail"] .book-detail-title.detail-title {
  max-width: 100%;
  text-wrap: balance;
}

body:not(.theme-quoc-tang):not(.theme-quoc-tang) .detail-action-btn--read {
  --detail-action-bg: var(--public-brand);
  --detail-action-bg-hover: var(--public-brand-hover);
  --detail-action-border: var(--public-brand);
  --detail-action-border-hover: var(--public-brand-hover);
  --detail-action-text: #fff;
}

@media (max-width: 768px) {
  /* Thông tin sách 2 cột thay vì 1 cột dài */
  body[data-page-kind="detail"] .detail-tech-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 20px;
  }

  /* ISBN dài, để riêng một hàng cho khỏi gãy chữ số */
  body[data-page-kind="detail"] .detail-tech-grid > .detail-meta-item:first-child {
    grid-column: 1 / -1;
  }
}

/* ---- Tin tức: dùng cùng bộ chữ với phần còn lại của trang ---- */
.news-v2-shell {
  --news-v2-serif: var(--font-body);
}

.news-v2-shell h1,
.news-v2-shell h2,
.news-v2-shell h3 {
  font-family: var(--font-heading);
}

/* ---- Nút hỏi đáp nổi: nhỏ lại trên điện thoại, chân trang chừa chỗ ---- */
.public-footer-v2 {
  padding-bottom: 96px;
}

/* Nút nổi Trợ lý (D-152): cỡ 56/52 theo book_qa_module.css, không thu nhỏ bằng scale. */
