/* Book Chapter Styles
   ========================================================= */

body {
    background: repeating-linear-gradient(90deg, #ffc000 0px, #ffc000 2px, #fffbe6 2px, #fffbe6 100vw);
}

.book-chapter {
  background-color: #fffbe6;           /* Soft, paper-like background */
  color: #2d2d2d;                      /* High contrast, easy on eyes */
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 1.18rem;
  line-height: 1.85;
  max-width: 68ch;
  margin: 3em auto 4em auto;
  padding: 3em 2.5em 3em 2.5em;
  border-radius: 1.2em;
  box-shadow: 0 4px 32px 0 rgba(0,0,0,0.09);
  letter-spacing: 0.01em;
  border: 1px solid #f5e6b2;
  position: relative;
}

.book-chapter::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 1.2em;
  pointer-events: none;
  box-shadow: 0 0 0 12px #f9e7b7 inset;
  opacity: 0.3;
}

.book-chapter h1,
.book-chapter h2,
.book-chapter h3 {
  color: #b38600;                      /* Deep gold for headings */
  margin-top: 2em;
  margin-bottom: 1em;
  line-height: 1.3;
  font-weight: 700;
  font-family: "Merriweather", Georgia, serif;
  letter-spacing: 0.02em;
}
/* 
.book-chapter p {
  margin-bottom: 1.5em;
  text-indent: 2em;                    /* Indent first line for book feel */
}

.book-chapter p:first-child {
  text-indent: 0;                      /* No indent for first paragraph */
} */

.book-chapter ul,
.book-chapter ol {
  margin-bottom: 1.5em;
  padding-left: 2em;
}

.book-chapter li {
  margin-bottom: 0.75em;
}

/* .book-chapter a {
  color: #0077cc;
  text-decoration: underline;
}

.book-chapter a:focus,
.book-chapter a:hover {
  background-color: #fff2b2;
  outline: 2px solid #b38600;
  text-decoration: none;
} */

.book-chapter pre,
.book-chapter code {
  font-family: "Fira Mono", "Consolas", "Menlo", "Monaco", monospace;
  font-size: 1rem;
  background: #f6ecd1;
  color: #4a3c1a;
  border-radius: 0.5em;
}

.book-chapter pre {
  padding: 1em;
  margin: 1.5em 0;
  overflow-x: auto;
  box-shadow: 0 1px 8px 0 rgba(0,0,0,0.06);
  max-width: 66ch;
}

.book-chapter code {
  padding: 0.2em 0.4em;
  margin: 0 0.1em;
  background: #f6ecd1;
  color: #4a3c1a;
  border-radius: 0.3em;
  font-size: 0.95em;
  word-break: break-word;
}

.chapter-toc {
  position: fixed;
  left: -190px; /* Hide off-screen */
  top: 0;
  width: 220px;
  height: 100vh;
  overflow-y: auto;
  background: #fffbe6;
  border-right: 1px solid #f5e6b2;
  padding: 2em 1em;
  opacity: 0.95;
  box-shadow: 2px 0 12px rgba(0,0,0,0.04);
  transition: left 0.5s ease-in; /* Smooth, natural easing */
  z-index: 100;
}

/* Show on hover */
.chapter-toc:hover,
.chapter-toc:focus-within {
  left: 0;
}

/* Icon button to reveal TOC */
.chapter-toc-toggle {
  position: fixed;
  left: 0;
  top: 2em;
  width: 40px;
  height: 40px;
  background: #b38600;
  color: #fff;
  border-radius: 0 1em 1em 0;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 2px 2px 8px rgba(0,0,0,0.08);
  transition: left 0.5s ease-in; /* Smooth, natural easing */
  z-index: 101;
}

/* Show on hover */
.chapter-toc:hover,
.chapter-toc:focus-within {
  left: 0;
}

.chapter-toc-toggle:hover {
  background: #0077cc;
}

/* Hide toggle when TOC is open */
.chapter-toc:hover .chapter-toc-toggle,
.chapter-toc:focus-within .chapter-toc-toggle {
  left: -10%;
  pointer-events: none;
}

/* Responsive: hide TOC on mobile */
@media screen and (max-width: 640px) {
  .chapter-toc,
  .chapter-toc-toggle {
    display: none !important;
  }
}

.chapter-toc .toc-inner {
  background: #fffbe6;
  border-radius: 1em;
  padding: 0;
  margin-bottom: 2em;
  box-shadow: 0 2px 12px rgba(0,0,0,0.04);
  font-size: 1rem;
  max-width: 320px;
}

.chapter-toc ul,
.chapter-toc li {
  margin: 0;
  padding: 0;
}

.chapter-toc ul {
  list-style: none;
}

.chapter-toc li {
  margin-left: .5em;
  margin-bottom: 0.5em;
}

.chapter-toc li li {
  margin-left: .5em;
  font-size: 0.95rem;
}

.chapter-toc a {
  color: #b38600;
  text-decoration: none;
  transition: color 0.2s;
}

.chapter-toc a:hover,
.chapter-toc a:focus {
  color: #0077cc;
  text-decoration: underline;
}


.book-chapter img {
    mix-blend-mode: multiply;
}