/*
 * Styles for the React replacements of Elementor/DearFlip runtime widgets.
 * Everything else comes from the original stylesheets in elementor.css.
 */

html {
  scroll-behavior: smooth;
}

/* Gallery (f67881f): masonry with uniform thumbnails -> column grid. 3 cols / 8px desktop, 2 cols / 10px below 1025px. */
.rt-gallery {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  --animation-duration: 350ms;
}
@media (max-width: 1024px) {
  .rt-gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
}
.rt-gallery .e-gallery-item {
  width: auto;
}

/* Lightbox: neutralise the kit's global button styling and lay out Elementor's lightbox chrome. */
.elementor-kit-46 .elementor-lightbox button {
  background: none;
  border: 0;
  border-radius: 0;
  padding: 0.25em;
  margin: 0;
  line-height: 1;
  color: var(--lightbox-ui-color);
  font-size: inherit;
  cursor: pointer;
}
.elementor-kit-46 .elementor-lightbox button:hover,
.elementor-kit-46 .elementor-lightbox button:focus {
  background: none;
  color: var(--lightbox-ui-color-hover);
}
.elementor-lightbox {
  display: flex;
  background-color: #000;
}
.elementor-lightbox .dialog-widget-content {
  position: relative;
}
.elementor-lightbox .elementor-slideshow__header .rt-lightbox-icon {
  margin: 0 0.35em;
}
.elementor-lightbox .elementor-slideshow__header .elementor-slideshow__counter {
  margin-right: auto;
}
.elementor-lightbox .elementor-lightbox-image {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
.elementor-lightbox .elementor-slideshow__footer {
  bottom: 0;
  text-align: center;
}
.elementor-kit-46 .elementor-lightbox .rt-lightbox-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  display: inline-flex;
  font-size: var(--lightbox-navigation-icons-size);
}
.elementor-lightbox .rt-lightbox-nav.elementor-swiper-button-prev {
  left: 10px;
}
.elementor-lightbox .rt-lightbox-nav.elementor-swiper-button-next {
  right: 10px;
}

/* Reservation form: textarea is shown once "special request" is ticked (original custom HTML widget). */
.elementor-form.rt-special-request #form-field-field_8203fde {
  display: block;
}

/* Elementor form messages. */
.elementor-form .elementor-message {
  margin: 10px 0;
  font-size: 1em;
  line-height: 1;
}
.elementor-form .elementor-message-success {
  color: #5cb85c;
}
.elementor-form .elementor-message-danger {
  color: #d9534f;
}
.elementor-form.elementor-form-waiting button[type="submit"] {
  opacity: 0.6;
  pointer-events: none;
}

/* Flipbook (DearFlip replacement). */
.rt-flipbook {
  position: relative;
  width: 100%;
  padding: 20px 20px 10px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.rt-flipbook__stage {
  position: relative;
  width: 100%;
  /* Keep the open spread within the viewport (spread ratio 1190:842). */
  max-width: min(1100px, calc((100vh - 140px) * 1.413));
  min-height: 240px;
  container-type: inline-size;
}
/* Server-rendered cover shown until the page-turning book is ready: same box as the book. */
.rt-flipbook__placeholder {
  position: relative;
  aspect-ratio: 1190 / 842;
}
.rt-flipbook__placeholder img {
  position: absolute;
  top: 0;
  left: 50%;
  width: 50%;
  height: 100%;
  object-fit: cover;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.25);
}
/* page-flip switches to single pages when the book is narrower than 520px. */
@container (max-width: 519px) {
  .rt-flipbook__placeholder {
    aspect-ratio: 595 / 842;
  }
  .rt-flipbook__placeholder img {
    left: 0;
    width: 100%;
  }
  .rt-flipbook__shift {
    transform: none !important;
  }
}
.rt-flipbook__shift {
  transition: transform 0.8s ease;
}
.rt-flipbook__leaf {
  background: transparent;
}
.rt-flipbook__leaf img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  -webkit-user-drag: none;
}
.rt-flipbook--fullscreen {
  height: 100vh;
  justify-content: center;
}
.rt-flipbook--fullscreen .rt-flipbook__stage {
  max-width: calc((100vh - 90px) * 1.413);
}
.rt-flipbook__book .stf__item img,
.rt-flipbook__book img {
  user-select: none;
}
.rt-flipbook__controls {
  display: flex;
  align-items: center;
  gap: 2px;
  margin-top: 14px;
  padding: 4px;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  font-family: "Inter", sans-serif;
  font-size: 13px;
}
.elementor-kit-46 .rt-flipbook__controls button,
.rt-flipbook__controls a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 32px;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: #fff;
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
  transition: background-color 0.2s;
}
.elementor-kit-46 .rt-flipbook__controls button:hover,
.elementor-kit-46 .rt-flipbook__controls button:focus-visible,
.rt-flipbook__controls a:hover {
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
}
.elementor-kit-46 .rt-flipbook__controls button:disabled {
  opacity: 0.35;
  cursor: default;
  background: transparent;
}
.rt-flipbook__page {
  min-width: 64px;
  text-align: center;
}

/* page-flip (StPageFlip) v2.0.7 base styles, MIT License */
.stf__parent {
  position: relative;
  display: block;
  box-sizing: border-box;
  transform: translateZ(0);

  -ms-touch-action: pan-y;
  touch-action: pan-y;
}

.sft__wrapper {
  position: relative;
  width: 100%;
  box-sizing: border-box;
}

.stf__parent canvas {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}

.stf__block {
  position: absolute;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  perspective: 2000px;
}

.stf__item {
  display: none;
  position: absolute;
  transform-style: preserve-3d;
}

.stf__outerShadow {
  position: absolute;
  left: 0;
  top: 0;
}

.stf__innerShadow {
  position: absolute;
  left: 0;
  top: 0;
}

.stf__hardShadow {
  position: absolute;
  left: 0;
  top: 0;
}

.stf__hardInnerShadow {
  position: absolute;
  left: 0;
  top: 0;
}
.elementor-lightbox:focus {
  outline: none;
}

/* Spam trap field in the forms (ElementorForm): hidden from people and screen readers, filled in by bots. */
.rt-hp-field {
  position: absolute !important;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
