/* Theme 221 — submenus for Accommodation and Additional parent pages.
   Uses the shared themes/_common/_nav_item.html markup
   (.dropdown-trigger / .offcanvas-slide-toggle / .has-dropdown).
   Selectors only touch nodes that exist when a parent has children. */

/* --- Parent trigger (top bar, side drawer and mobile drawer) --- */
li.has-dropdown > a.dropdown-trigger,
li.offcanvas-has-dropdown > a.offcanvas-slide-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.nav-link-label {
  flex: 0 0 auto;
  width: auto;
  cursor: pointer;
}

.nav-dropdown-arrow {
  flex: 0 0 auto;
  box-sizing: content-box;
  padding: 10px 6px;
  margin: -10px -4px -10px -2px;
  cursor: pointer;
  transition: transform 0.25s ease-in-out;
}

li.has-dropdown.open > a.dropdown-trigger .nav-dropdown-arrow,
li.offcanvas-has-dropdown > a.offcanvas-slide-toggle[aria-expanded="true"] .nav-dropdown-arrow {
  transform: rotate(180deg);
}

/* --- Desktop panel, rendered at body level --- */
.nav-dropdown-portal {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9998;
  min-width: 210px;
  max-width: min(320px, 90vw);
  padding: 8px;
  background: var(--menu-panel-bg, #1c1c1d);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.28);
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity 0.25s ease-in-out, transform 0.25s ease-in-out, visibility 0.25s;
  pointer-events: none;
}

.nav-dropdown-portal.open {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}

.nav-dropdown-portal-menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

.nav-dropdown-portal-menu li {
  margin: 0;
  padding: 0;
}

.nav-dropdown-portal-menu li a {
  display: block;
  padding: 8px 12px;
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #ffffff !important;
  text-decoration: none;
  transition: background-color 0.2s ease-in-out;
}

.nav-dropdown-portal-menu li a:hover,
.nav-dropdown-portal-menu li a:focus-visible {
  background: rgba(255, 255, 255, 0.14);
}

.nav-dropdown-portal-menu li.active > a,
.nav-dropdown-portal-menu li a[aria-current="page"] {
  font-weight: 600;
  background: rgba(255, 255, 255, 0.1);
}

/* --- Side drawer (desktop overflow "more" panel): accordion instead of a panel --- */
header.main-header nav.navbar .top--bar ul.desktop-menu-main li.nav-menu-more ul.dropdown-content.dropdown-menu li.has-dropdown > a.dropdown-trigger {
  display: flex;
  justify-content: space-between;
  width: 100%;
}

/* Only the drawer renders the accordion; back in the top bar the item uses the portal. */
.nav-more-subitems {
  display: none;
}

header.main-header nav.navbar .top--bar ul.desktop-menu-main li.nav-menu-more ul.dropdown-content.dropdown-menu .nav-more-subitems {
  display: block;
  list-style: none;
  margin: 8px 0 0;
  padding: 0;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease-in-out;
}

header.main-header nav.navbar .top--bar ul.desktop-menu-main li.nav-menu-more ul.dropdown-content.dropdown-menu .nav-more-subitems.open {
  max-height: 55vh;
  overflow: auto;
}

header.main-header nav.navbar .top--bar ul.desktop-menu-main li.nav-menu-more ul.dropdown-content.dropdown-menu .nav-more-subitems li {
  padding: 6px 10px 6px 22px;
  font-size: 15px;
}

/* --- Mobile drawer accordion --- */
header .mobile-menu ul.nav-links-mobile li.offcanvas-has-dropdown > a.offcanvas-slide-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: 8px;
}

header .mobile-menu ul.nav-links-mobile ul.offcanvas-slide-menu {
  list-style: none;
  margin: 6px 0 0;
  padding: 0;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease-in-out;
}

header .mobile-menu ul.nav-links-mobile ul.offcanvas-slide-menu.open {
  max-height: 55vh;
  overflow: auto;
}

header .mobile-menu ul.nav-links-mobile ul.offcanvas-slide-menu li {
  padding: 8px 10px 8px 20px;
  font-size: 15px;
}

/* Below the desktop breakpoint the top bar is hidden, so the portal must be too. */
@media (max-width: 991px) {
  .nav-dropdown-portal {
    display: none !important;
  }
}

/* --- Accessibility modes --- */
body.high-contrast .nav-dropdown-portal {
  background: #000000 !important;
  border: 1px solid #ffffff;
}

body.high-contrast .nav-dropdown-portal-menu li a,
body.high-contrast .nav-more-subitems li a,
body.high-contrast header .mobile-menu ul.nav-links-mobile ul.offcanvas-slide-menu li a {
  color: #ffffff !important;
}

@media (prefers-reduced-motion: reduce) {
  .nav-dropdown-portal,
  .nav-dropdown-arrow,
  .nav-more-subitems,
  header .mobile-menu ul.nav-links-mobile ul.offcanvas-slide-menu {
    transition-duration: 0.01ms;
  }
}
