/* ── BLOG INTEGRATION: start ──
   Styles for [[book:ID]] references and their hover popup, injected
   into Blog post pages by resolve_book_refs(). Deliberately
   self-contained (no dependency on booklist's own CSS variables, which
   aren't loaded on Blog pages) and namespaced under .book-ref / .brp-
   so it can't collide with the host theme's own classes. */

a.book-ref {
  font-weight: 600;
  text-decoration: underline;
  text-decoration-style: dotted;
  text-underline-offset: 2px;
  cursor: help;
}

.book-ref-popup {
  display: none;
  position: absolute;
  z-index: 9999;
  width: 260px;
  max-width: calc(100vw - 2rem);
  background: #fff;
  color: #222;
  border: 1px solid #ddd;
  border-radius: 8px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 0.875rem;
  line-height: 1.4;
  overflow: hidden;
}

.book-ref-popup.open {
  display: flex;
}

.book-ref-popup .brp-cover {
  width: 72px;
  height: 96px;
  object-fit: cover;
  flex-shrink: 0;
  background: #f1f1f1;
}

.book-ref-popup .brp-body {
  padding: 0.6rem 0.75rem;
  min-width: 0;
}

.book-ref-popup .brp-title {
  font-weight: 700;
  margin-bottom: 0.15rem;
}

.book-ref-popup .brp-author {
  color: #666;
  margin-bottom: 0.3rem;
}

.book-ref-popup .brp-sung-to {
  margin-bottom: 0.4rem;
  color: #444;
}

.book-ref-popup .brp-link {
  display: inline-block;
  font-weight: 600;
  text-decoration: none;
  color: #27500a;
}

.book-ref-popup .brp-link:hover {
  text-decoration: underline;
}

.book-ref-popup .brp-loading {
  padding: 0.75rem;
  color: #888;
}
/* ── BLOG INTEGRATION: end ── */