/* Klever v34 — the mobile navigation lives in the same sticky row as the header.
   The visible trigger is placed directly after the booking button. */

@media (max-width: 767.98px) {
  :root {
    --klever-mobile-header-height: 66px;
  }

  /* The header, not the legacy separate navbar, stays with the visitor while scrolling. */
  html body.klever-site-page header.klever-home-header,
  html body.klever-site-page header.klever-site-header {
    position: -webkit-sticky !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 71000 !important;
  }

  html body.klever-site-page .klever-home-header__inner,
  html body.klever-site-page .klever-site-header__inner {
    width: calc(100% - 32px) !important;
    height: var(--klever-mobile-header-height) !important;
    min-height: var(--klever-mobile-header-height) !important;
  }

  /* Reserve room for: phone + booking + menu. */
  html body.klever-site-page .klever-home-header__brand,
  html body.klever-site-page .klever-site-header__brand {
    max-width: calc(100vw - 220px) !important;
  }

  html body.klever-site-page .klever-home-header__actions,
  html body.klever-site-page .klever-site-header__actions {
    gap: 6px !important;
    margin-left: 8px !important;
  }

  html body.klever-site-page .klever-home-header__booking,
  html body.klever-site-page .klever-site-header__booking {
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 10px !important;
    font-size: 12px !important;
    line-height: 38px !important;
  }

  /* The only visible mobile menu trigger. It is a native label for the checkbox inside #menu. */
  html body.klever-site-page .klever-mobile-inline-menu-toggle {
    position: relative !important;
    z-index: 71020 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 38px !important;
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 1px solid #d5b366 !important;
    border-radius: 10px !important;
    background: #fffdf8 !important;
    color: #60461d !important;
    cursor: pointer !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent !important;
    box-sizing: border-box !important;
  }

  html body.klever-site-page .klever-mobile-inline-menu-toggle__bars,
  html body.klever-site-page .klever-mobile-inline-menu-toggle__bars::before,
  html body.klever-site-page .klever-mobile-inline-menu-toggle__bars::after {
    position: absolute !important;
    display: block !important;
    width: 19px !important;
    height: 2px !important;
    border-radius: 99px !important;
    background: currentColor !important;
    content: '' !important;
    transition: transform .18s ease, opacity .18s ease !important;
  }
  html body.klever-site-page .klever-mobile-inline-menu-toggle__bars { position: relative !important; }
  html body.klever-site-page .klever-mobile-inline-menu-toggle__bars::before { top: -6px !important; left: 0 !important; }
  html body.klever-site-page .klever-mobile-inline-menu-toggle__bars::after { top: 6px !important; left: 0 !important; }

  html body.klever-site-page.klever-mobile-nav-open .klever-mobile-inline-menu-toggle__bars,
  html body.klever-site-page:has(#klever-mobile-menu-state:checked) .klever-mobile-inline-menu-toggle__bars {
    background: transparent !important;
  }
  html body.klever-site-page.klever-mobile-nav-open .klever-mobile-inline-menu-toggle__bars::before,
  html body.klever-site-page:has(#klever-mobile-menu-state:checked) .klever-mobile-inline-menu-toggle__bars::before {
    top: 0 !important;
    transform: rotate(45deg) !important;
  }
  html body.klever-site-page.klever-mobile-nav-open .klever-mobile-inline-menu-toggle__bars::after,
  html body.klever-site-page:has(#klever-mobile-menu-state:checked) .klever-mobile-inline-menu-toggle__bars::after {
    top: 0 !important;
    transform: rotate(-45deg) !important;
  }

  /* Remove the old second navigation row completely. The panel itself remains available when opened. */
  html body.klever-site-page #klever-menu-placeholder {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html body.klever-site-page #menu,
  html body.klever-site-page #menu.default,
  html body.klever-site-page #menu.fixed {
    position: static !important;
    z-index: auto !important;
    width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html body.klever-site-page #menu .navbar,
  html body.klever-site-page #menu .navbar-inverse,
  html body.klever-site-page #menu .navbar > .container {
    position: static !important;
    width: 0 !important;
    min-height: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html body.klever-site-page #menu .navbar-header,
  html body.klever-site-page #menu #klever-mobile-menu-button {
    display: none !important;
  }

  html body.klever-site-page #menu #klever-mobile-menu-state ~ .navbar-collapse,
  html body.klever-site-page #menu #klever-mobile-menu-state ~ .navbar-collapse.collapse,
  html body.klever-site-page #menu #klever-mobile-menu-state ~ .navbar-collapse.in,
  html body.klever-site-page #menu #klever-mobile-menu-state ~ .navbar-collapse.collapsing {
    position: fixed !important;
    z-index: 70950 !important;
    top: var(--klever-mobile-header-height) !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    display: none !important;
    width: 100vw !important;
    height: calc(100dvh - var(--klever-mobile-header-height)) !important;
    max-height: calc(100dvh - var(--klever-mobile-header-height)) !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    border: 0 !important;
    border-top: 1px solid #e7dfd3 !important;
    border-radius: 0 !important;
    background: #fffdf9 !important;
    box-shadow: 0 22px 48px rgba(32,24,14,.19) !important;
    -webkit-overflow-scrolling: touch !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  html body.klever-site-page.klever-mobile-nav-open #menu #klever-mobile-menu-state ~ .navbar-collapse,
  html body.klever-site-page:has(#klever-mobile-menu-state:checked) #menu #klever-mobile-menu-state ~ .navbar-collapse,
  html body.klever-site-page #menu #klever-mobile-menu-state:checked ~ .navbar-collapse {
    display: block !important;
  }

  html body.klever-site-page #menu .navbar-nav.upper {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 8px 18px 28px !important;
  }

  html body.klever-site-page #menu .navbar-nav.upper > li {
    float: none !important;
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html body.klever-site-page #menu .navbar-inverse .navbar-nav > li > a {
    display: flex !important;
    align-items: center !important;
    min-height: 52px !important;
    padding: 14px 12px !important;
    border-bottom: 1px solid #eee8de !important;
    color: #403930 !important;
    background: transparent !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
  }

  html body.klever-site-page #menu .navbar-inverse .navbar-nav > li:last-child > a {
    border-bottom: 0 !important;
  }

  html body.klever-site-page #menu .dropdown-menu,
  html body.klever-site-page #menu .klever-more-menu > .dropdown-menu {
    position: static !important;
    float: none !important;
    display: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html body.klever-site-page #menu .klever-more-menu.open > .dropdown-menu,
  html body.klever-site-page #menu .klever-more-menu.klever-v21-more-open > .dropdown-menu {
    display: block !important;
  }

  html body.klever-site-page #menu .dropdown-menu > li > a {
    display: block !important;
    min-height: 0 !important;
    padding: 12px 12px 12px 28px !important;
    color: #6d6255 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
  }
}

@media (max-width: 374px) {
  html body.klever-site-page .klever-home-header__inner,
  html body.klever-site-page .klever-site-header__inner { width: calc(100% - 24px) !important; }
  html body.klever-site-page .klever-home-header__brand,
  html body.klever-site-page .klever-site-header__brand { max-width: calc(100vw - 204px) !important; }
  html body.klever-site-page .klever-home-header__actions,
  html body.klever-site-page .klever-site-header__actions { gap: 5px !important; margin-left: 6px !important; }
  html body.klever-site-page .klever-home-header__booking,
  html body.klever-site-page .klever-site-header__booking { padding: 0 8px !important; font-size: 11px !important; }
  html body.klever-site-page .klever-mobile-inline-menu-toggle { flex-basis: 36px !important; width: 36px !important; min-width: 36px !important; height: 36px !important; min-height: 36px !important; }
}

@media (min-width: 768px) {
  html body.klever-site-page .klever-mobile-inline-menu-toggle { display: none !important; }
}