/* =========================================================
   Real3D FlipBook Widget CSS
   Archivo: css/real3d-widget.css
   ========================================================= */

.real3d-widget-block {
  width: 100%;
  height: var(--r3d-block-height, 100dvh) !important;
  min-height: var(--r3d-block-height, 100dvh);
  position: relative;
  display: block;
  overflow: hidden;
  box-sizing: border-box;
}

/*
  El contenedor que recibe new FlipBook(container, options)
  queda encerrado dentro del alto del padre.
*/
.r3d-flipbook-widget {
  width: var(--r3d-width, 100%) !important;
  height: var(--r3d-height, 100%) !important;
  position: absolute;
  inset: 0;
  display: block;
  overflow: hidden;
  box-sizing: border-box;
}

.r3d-flipbook-widget,
.r3d-flipbook-widget * {
  box-sizing: border-box;
}

real3d-flipbook {
  width: auto;
  min-height: auto;
  position: relative;
  display: block;
  overflow: hidden;
  box-sizing: border-box;
}

.r3d-flipbook-widget .flipbook-wrapper,
.r3d-flipbook-widget .flipbook-wrapper-transparent,
.r3d-flipbook-widget .flipbook-bookLayer,
.r3d-flipbook-widget .flipbook-book-webgl,
.r3d-flipbook-widget .flipbook-main-wrapper {
  width: 100% !important;
  height: 100% !important;
}

/*
  Botón fallback para modo button.
*/
.r3d-flipbook-button {
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 10px 18px;
  border: 0;
  background: #fff;
  color: #111;
  font-family: inherit;
  font-size: 15px;
  font-weight: bold;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
}

.r3d-flipbook-button:hover {
  opacity: 0.85;
}

.r3d-flipbook-button:focus {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}

.r3d-flipbook-lightbox-helper {
  display: none;
}

.r3d-flipbook-widget .r3d-youtube-page-item {
  z-index: 120;
  background: transparent;
  overflow: hidden;
  pointer-events: auto;
}

.r3d-flipbook-widget .r3d-youtube-page-item iframe,
.r3d-flipbook-widget .r3d-youtube-page-item .r3d-yt-iframe {
  width: 100% !important;
  height: 100% !important;
  border: 0;
}

@media (max-width: 768px) {
  .real3d-widget-block {
    min-height: 360px;
  }
}