/* Book-specific styles */
#book { 
    width: auto; 
    height: auto; 
    margin: 1rem auto; 
    border-radius: 8px;
    max-width: 95vw;
    max-height: 90vh;
    background: #2a2a2a;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
    display: block;
    position: relative;
    min-height: 400px;
  }
  
  .pf-page { 
    display:flex; 
    align-items:center; 
    justify-content:center; 
    font-weight:700; 
    font-size:1.25rem; 
    overflow: hidden;
    position: relative;
    z-index: 1;
    background: #ffffff;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none;
    margin: 0;
    padding: 0;
    border: none;
  }
  
  /* Page image styles */
  .page-image {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    border-radius: 0;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    pointer-events: none;
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none;
    display: block;
    margin: 0;
    padding: 0;
    max-width: 100%;
    max-height: 100%;
  }
  
  /* Hide scrollbars but keep content visible - Universal approach */
  * {
    scrollbar-width: none !important; /* Firefox */
    -ms-overflow-style: none !important; /* IE and Edge */
  }
  
  *::-webkit-scrollbar {
    display: none !important; /* Chrome, Safari, Opera */
    width: 0 !important;
    height: 0 !important;
  }
  
  /* Ensure StPageFlip container allows content visibility */
  .st-page-flip {
    overflow: visible !important;
  }
  
  /* Allow all page elements to be visible */
  .st-page,
  .st-page-content,
  .st-page-flip .st-page,
  .st-page-flip .st-page-content {
    overflow: visible !important;
  }
  
  /* Responsive adjustments for book */
  @media (max-width: 1024px) {
    #book { 
      max-width: 90vw; 
      max-height: 80vh; 
      margin: 0.5rem auto;
    }
  }
  
  @media (max-width: 768px) {
    #book { 
      max-width: 95vw; 
      max-height: 75vh; 
      margin: 0.5rem auto;
    }
    
    .pf-page { 
      font-size: 1rem; 
    }
  }
  
  @media (max-width: 480px) {
    #book { 
      max-width: 98vw; 
      max-height: 70vh;
      margin: 0.5rem auto;
    }
    
    .pf-page { 
      font-size: 0.875rem; 
    }
  }