/**
 * PDF flipbook embed (templates/flipbook.php).
 *
 * Standalone rather than part of the scss build, so it ships without
 * recompiling main.css.
 */

.flipbook {
  margin: 0 0 1.5rem;
}

.flipbook-stage {
  position: relative;
  height: var(--flipbook-height, 80vh);
  /* Below roughly this the two-page spread has no room to render. */
  min-height: 420px;
  overflow: hidden;
  background: #111827;
  border-radius: 6px;
}

.flipbook-stage iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

.flipbook-fallback {
  margin: 0.75rem 0 0;
  font-size: 0.875rem;
  text-align: center;
}

/* Phones can't fit a spread, and vh units fight the browser chrome, so give
   the viewer a fixed portrait-friendly stage instead. */
@media (max-width: 767px) {
  .flipbook-stage {
    height: 70vh;
    min-height: 340px;
  }
}