/* Shared Forest Library treatment for every individual-book page.
   It only targets .book-page; catalog pages keep their own design. */
.book-page {
  --book-cream: #f8f1dc;
  --book-green: #0a3924;
  --book-gold: #cfaa46;
  --book-shadow: 0 16px 36px rgba(12, 40, 24, .15), inset 0 1px rgba(255, 255, 255, .72);
  --book-motion: .18s ease;
  background: #e8dfc8;
  color: #183225;
}

.book-page .page-main {
  background-color: #f7f0df;
  background-image:
    radial-gradient(circle at 78% 8%, rgba(222, 184, 83, .2), transparent 22rem),
    linear-gradient(90deg, rgba(247, 240, 223, .83), rgba(247, 240, 223, .58) 20%, rgba(247, 240, 223, .58) 80%, rgba(247, 240, 223, .83)),
    url('images/books-children-fixed-library-v1.png');
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
}
.book-page .content-with-sides {
  grid-template-columns: minmax(130px, 1fr) minmax(0, 940px) minmax(130px, 1fr);
  gap: 28px;
  align-items: stretch;
}
.book-page .page-content {
  max-width: 1120px;
  margin: 22px auto 36px;
  padding: 26px 32px 32px;
  border: 1px solid rgba(104, 80, 34, .22);
  border-radius: 20px;
  background: rgba(255, 252, 239, .8);
  box-shadow: var(--book-shadow);
}

.book-page .book-hero-wrap {
  grid-template-columns: minmax(0, 1fr) 310px;
  grid-template-rows: minmax(430px, auto) auto;
  max-width: none;
  column-gap: 44px;
  row-gap: 20px;
}
.book-page .book-hero-left { padding-top: 28px; }
.book-page .book-hero-title { max-width: 330px; }
.book-page .page-content .book-hero-title h1,
.book-page .book-description-heading {
  color: var(--book-green);
  font-family: Georgia, 'Times New Roman', serif;
  text-shadow: none;
  text-transform: none;
}
.book-page .page-content .book-hero-title h1 {
  font-size: clamp(1.8rem, 2vw, 2rem);
  line-height: 1.1;
  text-align: left;
  overflow-wrap: break-word;
}
.book-page .book-hero-title h2 { color: #6c572a; font-family: Georgia, 'Times New Roman', serif; }
.book-page .book-hero-image { width: 310px; justify-self: center; align-self: center; }
.book-page .book-flip-card { width: 310px; max-width: 100%; box-shadow: 0 17px 17px rgba(15, 42, 27, .24); }
.book-page .book-flip-inner { transition: transform 2.5s ease; }
.book-page .book-flip-front,
.book-page .book-flip-back { border-radius: 8px; overflow: hidden; background-color: #e6dac0; }
.book-page .book-flip-front img,
.book-page .book-flip-back img { width: 100%; height: 100%; object-fit: contain; object-position: center; }

.book-page .book-description-panel {
  border: 1px solid rgba(161, 123, 37, .3);
  border-radius: 15px;
  background: linear-gradient(135deg, rgba(255, 255, 255, .7), rgba(245, 234, 199, .64));
  box-shadow: inset 0 1px rgba(255, 255, 255, .85);
}
.book-page .book-description-below { padding: 24px 28px; }
.book-page .book-description { color: #263d2e; font-size: 1rem; line-height: 1.68; text-align: left; }
.book-page .book-description-heading { font-size: clamp(1.4rem, 2vw, 2rem); }

/* Keep the whole side menu fixed in the browser window while the book page scrolls. */
.book-page .content-with-sides > .side-links-left {
  position: fixed;
  top: 114px;
  align-self: start;
  width: 130px;
  margin-top: 0;
  z-index: 30;
}
.book-page .side-links-left { padding-top: 0; }
.book-page .side-links-left .side-link,
.book-page .page-content .book-hero-cta .btn.btn-accent,
.book-page .page-content .book-format-buttons .btn.btn-accent,
.book-page .paper-menu a {
  border: 1px solid rgba(232, 207, 115, .68) !important;
  background: linear-gradient(160deg, #1a5a36, #092d1d 62%, #061e14) !important;
  color: #fff6cf !important;
  box-shadow: 0 4px 0 #03150d, 0 8px 15px rgba(3, 23, 14, .25), inset 0 1px rgba(255, 255, 255, .26) !important;
  text-shadow: 0 1px rgba(0, 0, 0, .3);
  transition: transform var(--book-motion), box-shadow var(--book-motion), filter var(--book-motion);
}
.book-page .side-links-left .side-link:hover,
.book-page .side-links-left .side-link:focus-visible,
.book-page .page-content .book-hero-cta .btn.btn-accent:hover,
.book-page .page-content .book-hero-cta .btn.btn-accent:focus-visible,
.book-page .page-content .book-format-buttons .btn.btn-accent:hover,
.book-page .page-content .book-format-buttons .btn.btn-accent:focus-visible,
.book-page .paper-menu a:hover,
.book-page .paper-menu a:focus-visible {
  transform: translateY(-1px);
  filter: brightness(1.1);
  box-shadow: 0 6px 0 #03150d, 0 12px 20px rgba(3, 23, 14, .3), inset 0 1px rgba(255, 255, 255, .34) !important;
}
.book-page .side-links-left .side-link:active,
.book-page .page-content .book-hero-cta .btn.btn-accent:active,
.book-page .page-content .book-format-buttons .btn.btn-accent:active,
.book-page .paper-menu a:active {
  transform: translateY(2px);
  box-shadow: 0 1px 0 #03150d, inset 0 2px 5px rgba(0, 0, 0, .36) !important;
}
.book-page .side-links-left .side-link.active { background: linear-gradient(160deg, #bd9130, #8e6418) !important; color: #fff9df !important; }
.book-page .book-sidebar-audio-block { border-color: rgba(161, 123, 37, .32); background: rgba(255, 252, 239, .72); }
.book-page .book-fragment-seek::-webkit-slider-runnable-track { background: linear-gradient(90deg, #b78625 0%, #b78625 var(--seek-pct, 0%), #d7ceb5 var(--seek-pct, 0%), #d7ceb5 100%); }
.book-page .book-format-buttons { gap: 13px; margin-top: 8px; }
.book-page .page-content .book-hero-cta .btn.btn-accent,
.book-page .page-content .book-format-buttons .btn.btn-accent {
  min-height: 42px;
  padding: 10px 16px !important;
  border-radius: 10px !important;
  font-size: .82rem !important;
  letter-spacing: .035em;
}
.book-page .book-format-btn-pending .btn.btn-accent { opacity: .67; }
.book-page .book-status { color: #6b5527; }
.book-page .paper-menu { border-color: rgba(161, 123, 37, .34); background: #fff9e8; box-shadow: 0 12px 24px rgba(18, 47, 29, .18); }
.book-page .paper-menu a { margin: 7px; border-radius: 8px; }

@media (min-width: 1101px) {
  .book-page .site-header .site-title { max-width: 340px; white-space: nowrap; }
}
@media (max-width: 1024px) {
  .book-page .content-with-sides { grid-template-columns: 1fr; }
  .book-page .page-content { margin: 16px auto 28px; padding: 22px; }
  .book-page .book-hero-wrap { grid-template-columns: 1fr; grid-template-rows: auto; }
  .book-page .book-hero-image { grid-row: 1; width: 280px; }
  .book-page .book-flip-card { width: 280px; }
  .book-page .book-hero-left { grid-row: 2; padding-top: 4px; text-align: center; }
  .book-page .book-hero-title { max-width: none; }
  .book-page .book-description-panel { grid-row: 3; }
}
@media (max-width: 600px) {
  .book-page .page-content { margin: 10px 8px 22px; padding: 18px 14px 22px; border-radius: 14px; }
  .book-page .book-hero-image,
  .book-page .book-flip-card { width: min(260px, 100%); }
  .book-page .page-content .book-hero-title h1 { font-size: clamp(1.75rem, 9vw, 2.25rem); text-align: center; }
  .book-page .book-description-below { padding: 19px 17px; }
  .book-page .page-content .book-format-buttons .btn.btn-accent { width: 100%; }
}
