/* V497 — Keep internal full-page native scrollbars fully visible below the live sticky site header.
   The live header remains the single global header; only the scroll viewport origin changes. */
.v84-full-page.v483-live-header-only{
  inset:auto 0 0 0!important;
  top:var(--v483-live-header-height,76px)!important;
  bottom:0!important;
  height:auto!important;
  max-height:none!important;
  padding-top:0!important;
}

/* Preserve a clearly grab-able native scrollbar for mouse/trackpad users. */
.v84-full-page.v483-live-header-only::-webkit-scrollbar{
  width:14px;
  height:14px;
}
.v84-full-page.v483-live-header-only::-webkit-scrollbar-track{
  background:#dfe7ec;
}
.v84-full-page.v483-live-header-only::-webkit-scrollbar-thumb{
  background:#f56b16;
  border:3px solid #dfe7ec;
  border-radius:999px;
  min-height:52px;
}
.v84-full-page.v483-live-header-only::-webkit-scrollbar-thumb:hover{
  background:#d9560c;
}
@media(max-width:760px){
  .v84-full-page.v483-live-header-only::-webkit-scrollbar{
    width:10px;
    height:10px;
  }
}

/* V513 mobile full-page chrome: keep the ONE original header pinned to the
   viewport, even when the homepage was already scrolled before opening a page.
   A sticky header inside a scroll-locked mobile body could scroll offscreen,
   leaving a viewport-high hole showing the homepage behind the detail page. */
@media(max-width:860px){
body.v84-page-open > header.site-header,
body:has(> .v84-full-page.is-open) > header.site-header{
  position:fixed!important;
  top:0!important;
  right:0!important;
  bottom:auto!important;
  left:0!important;
  width:100%!important;
  z-index:10050!important;
}
/* Lock the underlying document on touch devices. The .v84 view itself remains
   the only scrollable page, so its Back, price and booking sections stay usable. */
html:has(body.v84-page-open),
html:has(body > .v84-full-page.is-open){
  overflow:hidden!important;
  overscroll-behavior:none!important;
}
body.v84-page-open,
body:has(> .v84-full-page.is-open){
  overflow:hidden!important;
  overscroll-behavior:none!important;
}

}
/* V513: The shared Back pill must occupy a clean, predictable toolbar row
   above hero content on narrow screens. Previous negative margins and a doubled
   sticky header offset placed it over titles in Safari/details pages. */
@media(max-width:860px){
  .v84-full-page.v483-live-header-only > .tour-modal-panel > .mts-back-v478,
  .v84-full-page.v483-live-header-only > .content-tab-panel > .mts-back-v478,
  .v84-full-page.v483-live-header-only > .booking-modal-panel > .mts-back-v478,
  .v84-full-page.v483-live-header-only > .site-modal-panel > .mts-back-v478,
  .v84-full-page.v483-live-header-only > .nyerere-panel > .mts-back-v478,
  .v84-full-page.v483-live-header-only > .selous-package-panel > .mts-back-v478,
  .v84-full-page.v483-live-header-only > .tz-package-panel > .mts-back-v478{
    position:sticky!important;
    top:10px!important;
    left:auto!important;
    float:none!important;
    display:inline-flex!important;
    margin:9px 12px 10px!important;
    z-index:4900!important;
    vertical-align:top!important;
  }
}
/* V513: outrank older ID-targeted Back-button sticky offsets; the scrollport
   already starts BELOW the live global header, so adding its height again is
   incorrect on mobile. Prevent safari/tour Back from covering hero headings. */
@media(max-width:860px){
  #tourDetailsModal.v84-full-page.v483-live-header-only > .tour-modal-panel > .tour-modal-close,
  #sunsetModal.v84-full-page.v483-live-header-only > .tour-modal-panel > .tour-modal-close,
  #mikumiModal.v84-full-page.v483-live-header-only > .tour-modal-panel > .tour-modal-close,
  #nyerereModal.v84-full-page.v483-live-header-only > .nyerere-panel > .nyerere-close,
  #tzSafarisTab.v84-full-page.v483-live-header-only > .content-tab-panel > .content-tab-close,
  .content-tab-modal.v84-full-page.v483-live-header-only > .content-tab-panel > .content-tab-close:not(.tz-safari-package-back),
  .tz-package-modal.v84-full-page.v483-live-header-only > .tz-package-panel > .content-tab-close{
    top:10px!important;
    margin:9px 12px 10px!important;
  }
}
/* V513: Terms, Privacy and Cancellation hero headings are nested <header>s.
   These must not inherit the global site's 76px sticky flex-bar styling. */
.policy-page header.policy-hero{
  position:relative!important;
  inset:auto!important;
  display:block!important;
  height:auto!important;
  min-height:0!important;
  width:100%!important;
  z-index:auto!important;
  overflow:visible!important;
}
