:root {
  --current-max-width: 113.5rem;

  --max-width: 94.5rem;
  --max-width-content: min(calc(100dvw - var(--max-width-spacing)), 74.75rem);
  --max-width-text-block: 49.5rem;
  --current-mobile-site-header-height: 52.41px;
  --max-width-navigation: 89.5rem;

  --max-width-single-spacing: var(--Layout-Mobile-Margin-Margin-min);
  --max-width-spacing: calc(var(--max-width-single-spacing) * 2);
  --max-width-page: min(
    calc(100dvw - var(--max-width-spacing)),
    var(--max-width-navigation)
  );

  --sitewide-alert-height: 0px; /* Will be overridden when a sitewide alert is visible */
  --main-menu-mobile-height: 75px;
  --main-menu-desktop-height: 125px;
  --booking-widget-mobile-height: 75px;
  --booking-widget-tablet-height: 150px;
  --booking-widget-desktop-height: 77px;
  --hotel-page-map-desktop-width: 23.75rem;

  /* Z-INDEX */
  --header-z-index: 11;
  --menu-overlay-z-index: 11;
  --booking-widget-z-index: 10;
  --booking-widget-open-z-index: 100;
  --dialog-z-index: 9;
  --back-to-top-button: 80;
  --language-switcher-z-index: 85;
  --sidepeek-z-index: 100;
  --lightbox-z-index: 150;
  --default-modal-overlay-z-index: 100;
  --default-modal-z-index: 101;

  --modal-box-shadow: 0px 4px 24px 0px rgba(38, 32, 30, 0.08);
  --popup-box-shadow: 0 0 14px 6px rgba(0, 0, 0, 0.1);

  @supports (interpolate-size: allow-keywords) {
    interpolate-size: allow-keywords;
  }
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
  scroll-behavior: smooth;
}

body {
  min-height: 100dvh;
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
  color: var(--Text-Default);
}

body.overflow-hidden {
  overflow: hidden;
}

.root {
  isolation: isolate;
}

/* From Tailwind */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

ul {
  padding-inline-start: 0;
  margin-block-start: 0;
  margin-block-end: 0;
}

@media screen and (min-width: 768px) {
  :root {
    --max-width-single-spacing: var(--Layout-Tablet-Margin-Margin-min);
  }

  body.overflow-hidden {
    overflow: auto;
    overflow-x: hidden;
  }
}

@media screen and (min-width: 1367px) {
  :root {
    --max-width-single-spacing: var(--Layout-Desktop-Margin-Margin-min);
  }
}
