/* APD 736 — final deterministic UI layer. */

/* -------------------------------------------------------------------------
   Mode switch: the loader is geometrically centered, not label-aligned.
   ------------------------------------------------------------------------- */
body.apd736-release a:is(.apd719-mode-switch,[data-apd619-mode-switch]) {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
}
body.apd736-release a:is(.apd719-mode-switch,[data-apd619-mode-switch]).is-apd736-mode-loading > :not(.apd736-mode-loader) {
  opacity: 0 !important;
  visibility: hidden !important;
}
body.apd736-release a:is(.apd719-mode-switch,[data-apd619-mode-switch]).is-apd736-mode-loading > :is(.apd719-mode-loader,.apd732-mode-loader) {
  display: none !important;
}
body.apd736-release a:is(.apd719-mode-switch,[data-apd619-mode-switch]).is-apd736-mode-loading::before,
body.apd736-release a:is(.apd719-mode-switch,[data-apd619-mode-switch]).is-apd736-mode-loading::after {
  opacity: 0 !important;
  animation: none !important;
}
body.apd736-release .apd736-mode-loader {
  position: absolute !important;
  top: 50% !important;
  right: auto !important;
  bottom: auto !important;
  left: 50% !important;
  z-index: 999 !important;
  box-sizing: border-box !important;
  width: 48px !important;
  height: 22px !important;
  min-width: 48px !important;
  min-height: 22px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(3,8px) !important;
  place-content: center !important;
  gap: 7px !important;
  transform: translate(-50%,-50%) !important;
  pointer-events: none !important;
}
body.apd736-release .apd736-mode-loader i {
  display: block !important;
  width: 8px !important;
  height: 8px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: #fff !important;
  box-shadow: 0 2px 6px rgba(0,0,0,.25) !important;
  animation: apd736-mode-dot .62s ease-in-out infinite !important;
}
body.apd736-release .apd736-mode-loader i:nth-child(2) { animation-delay: .09s !important; }
body.apd736-release .apd736-mode-loader i:nth-child(3) { animation-delay: .18s !important; }
@keyframes apd736-mode-dot {
  0%,100% { opacity: .38; transform: translateY(0); }
  50% { opacity: 1; transform: translateY(-3px); }
}

/* -------------------------------------------------------------------------
   Calendar: one state, one endpoint pair and one cell-level gray interval.
   ------------------------------------------------------------------------- */
html body.single-listing.apd736-release .apd52-native-calendar :is(ul.days,.days) {
  position: relative !important;
  isolation: isolate !important;
}
html body.single-listing.apd736-release .apd52-native-calendar :is(ul.days,.days) > li {
  position: relative !important;
  z-index: 2 !important;
  overflow: visible !important;
  background: transparent !important;
  box-shadow: none !important;
}
html body.single-listing.apd736-release .apd52-native-calendar :is(ul.days,.days) > li::before,
html body.single-listing.apd736-release .apd52-native-calendar :is(ul.days,.days) > li::after,
html body.single-listing.apd736-release .apd52-native-calendar :is(ul.days,.days) > li .day-number::before,
html body.single-listing.apd736-release .apd52-native-calendar :is(ul.days,.days) > li .day-number::after {
  content: none !important;
  display: none !important;
  background: transparent !important;
  box-shadow: none !important;
}
html body.single-listing.apd736-release .apd52-native-calendar :is(.apd524-range-band,.apd732-range-band,.apd735-range-band) {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
}
html body.single-listing.apd736-release .apd52-native-calendar .apd736-cell-fill {
  position: absolute !important;
  top: 50% !important;
  z-index: 1 !important;
  display: block !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #e9e9e9 !important;
  box-shadow: 1px 0 0 #e9e9e9,-1px 0 0 #e9e9e9 !important;
  transform: translateY(-50%) !important;
  pointer-events: none !important;
}
html body.single-listing.apd736-release .apd52-native-calendar .apd736-cell-fill.is-start { left: 50% !important; right: -2px !important; }
html body.single-listing.apd736-release .apd52-native-calendar .apd736-cell-fill.is-middle { left: -2px !important; right: -2px !important; }
html body.single-listing.apd736-release .apd52-native-calendar .apd736-cell-fill.is-end { left: -2px !important; right: 50% !important; }
html body.single-listing.apd736-release .apd52-native-calendar :is(ul.days,.days) > li:is(.apd736-range-start,.apd736-range-end) {
  z-index: 5 !important;
}
html body.single-listing.apd736-release .apd52-native-calendar :is(ul.days,.days) > li .day-number {
  position: relative !important;
  z-index: 3 !important;
  background: transparent !important;
  box-shadow: none !important;
}
html body.single-listing.apd736-release .apd52-native-calendar :is(ul.days,.days) > li:is(.apd736-range-start,.apd736-range-end) .day-number {
  z-index: 6 !important;
  display: inline-flex !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  align-items: center !important;
  justify-content: center !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #222 !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  box-shadow: none !important;
}
html body.single-listing.apd736-release .apd52-native-calendar :is(ul.days,.days) > li.apd736-range-middle .day-number {
  z-index: 4 !important;
  border: 0 !important;
  background: transparent !important;
  color: #222 !important;
  -webkit-text-fill-color: #222 !important;
}
html body.single-listing.apd736-release .apd52-native-calendar :is(ul.days,.days) > li.current-day:not(.apd736-range-start):not(.apd736-range-end) .day-number {
  display: inline-flex !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  align-items: center !important;
  justify-content: center !important;
  border: 2px solid #222 !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: #222 !important;
  -webkit-text-fill-color: #222 !important;
  box-shadow: none !important;
}

/* -------------------------------------------------------------------------
   Host facts: balanced gaps plus transparent, proportional 3D artwork.
   ------------------------------------------------------------------------- */
html body.single-listing.apd736-release .apd647-host-facts {
  row-gap: 18px !important;
}
html body.single-listing.apd736-release .apd647-host-facts .apd734-host-message-card {
  grid-template-columns: 66px minmax(0,1fr) !important;
  min-height: 118px !important;
  gap: 15px !important;
  margin-block: 7px !important;
  padding: 16px !important;
}
html body.single-listing.apd736-release .apd647-host-facts .apd734-host-message-card > img {
  width: 60px !important;
  height: 60px !important;
  max-width: 60px !important;
  max-height: 60px !important;
  object-fit: contain !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  filter: drop-shadow(0 9px 10px rgba(18,48,78,.19)) !important;
}
html body.single-listing.apd736-release .apd647-host-info .apd177-host-note {
  grid-template-columns: 92px minmax(0,1fr) !important;
  min-height: 122px !important;
  align-items: center !important;
  gap: 18px !important;
  padding: 18px 20px !important;
}
html body.single-listing.apd736-release .apd647-host-info .apd177-host-note-icon,
html body.single-listing.apd736-release .apd647-host-info .apd177-host-note-icon > img {
  display: block !important;
  width: 86px !important;
  height: 86px !important;
  max-width: 86px !important;
  max-height: 86px !important;
  object-fit: contain !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  filter: drop-shadow(0 10px 12px rgba(25,53,83,.2)) !important;
}

/* -------------------------------------------------------------------------
   Payments: every requested control is both a JavaScript modal trigger and a
   real server route, so a blocked script can no longer leave a dead button.
   ------------------------------------------------------------------------- */
body.apd736-payment-modal-open,
html.apd735-modal-open,
body.apd735-modal-open { overflow: hidden !important; overscroll-behavior: none !important; }
body.apd736-release .apd736-payment-route {
  position: relative !important;
  z-index: 3 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  text-decoration: none !important;
  pointer-events: auto !important;
  cursor: pointer !important;
  touch-action: manipulation !important;
}
body.apd736-release .apd735-modal-header > :is(button,a) {
  display: inline-grid !important;
  width: 46px !important;
  height: 46px !important;
  place-items: center !important;
  padding: 0 0 4px !important;
  border: 1px solid #e7e7e7 !important;
  border-radius: 50% !important;
  background: #f8f8f8 !important;
  color: #222 !important;
  font-size: 42px !important;
  font-weight: 300 !important;
  line-height: 1 !important;
  text-decoration: none !important;
}
body.apd736-release .apd735-sheet-header > :is(button,a) {
  display: grid !important;
  width: 42px !important;
  height: 42px !important;
  place-items: center !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: #f2f2f2 !important;
  color: #222 !important;
  font-size: 28px !important;
  line-height: 1 !important;
  text-decoration: none !important;
}
body.apd736-release .apd735-modal.apd736-server-open {
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* -------------------------------------------------------------------------
   Public experience/service categories: same dimensions, uncropped alpha art
   and the complete service list used by the creation flow.
   ------------------------------------------------------------------------- */
body.apd736-release .apd557-experience-picker,
body.apd736-release .apd23-service-directory {
  width: 100% !important;
  height: auto !important;
  overflow: hidden !important;
}
body.apd736-release .apd557-experience-picker-track,
body.apd736-release .apd23-service-category-rail {
  box-sizing: border-box !important;
  width: 100% !important;
  height: auto !important;
  padding: 8px 22px 18px !important;
  display: flex !important;
  grid-template-columns: none !important;
  gap: 15px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-padding-inline: 22px !important;
  scroll-snap-type: x proximity !important;
  scrollbar-width: none !important;
  -webkit-overflow-scrolling: touch !important;
}
body.apd736-release .apd557-experience-picker-track::-webkit-scrollbar,
body.apd736-release .apd23-service-category-rail::-webkit-scrollbar { display: none !important; }
body.apd736-release .apd557-experience-picker a,
body.apd736-release .apd23-service-category-rail > a {
  box-sizing: border-box !important;
  flex: 0 0 142px !important;
  width: 142px !important;
  min-width: 142px !important;
  min-height: 182px !important;
  padding: 10px 9px 13px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  overflow: visible !important;
  border: 1px solid rgba(24,45,72,.075) !important;
  border-radius: 23px !important;
  background: linear-gradient(145deg,rgba(255,255,255,.98),rgba(247,249,252,.96)) !important;
  color: #202226 !important;
  box-shadow: 0 12px 28px rgba(25,45,72,.09),inset 0 1px 0 #fff !important;
  text-align: center !important;
  text-decoration: none !important;
  scroll-snap-align: start !important;
}
body.apd736-release .apd557-experience-picker a:is(:hover,:focus-visible),
body.apd736-release .apd23-service-category-rail > a:is(:hover,:focus-visible,.is-active) {
  border-color: rgba(31,68,110,.22) !important;
  box-shadow: 0 16px 34px rgba(24,49,80,.14),inset 0 1px 0 #fff !important;
  transform: translateY(-2px) !important;
}
body.apd736-release .apd557-experience-picker-media,
body.apd736-release .apd23-service-category-rail .apd188-service-category-media {
  box-sizing: border-box !important;
  flex: 0 0 128px !important;
  width: 128px !important;
  height: 128px !important;
  min-width: 128px !important;
  min-height: 128px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.apd736-release .apd557-experience-picker-media > img,
body.apd736-release .apd23-service-category-rail .apd188-service-category-media > img {
  display: block !important;
  width: 124px !important;
  height: 124px !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  filter: drop-shadow(0 10px 10px rgba(20,42,68,.17)) !important;
}
body.apd736-release .apd557-experience-picker strong,
body.apd736-release .apd23-service-category-rail > a > strong {
  min-height: 35px !important;
  margin: 0 !important;
  display: -webkit-box !important;
  overflow: hidden !important;
  color: #202226 !important;
  font-size: 14px !important;
  font-weight: 780 !important;
  line-height: 1.18 !important;
  letter-spacing: -.015em !important;
  text-align: center !important;
  text-overflow: clip !important;
  white-space: normal !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}

@media (max-width: 767px) {
  body.apd736-release .apd557-experience-picker,
  body.apd736-release .apd23-service-directory { margin: 0 0 26px !important; }
  body.apd736-release .apd557-experience-picker-track,
  body.apd736-release .apd23-service-category-rail {
    width: 100vw !important;
    padding: 7px 18px 19px !important;
    gap: 13px !important;
    scroll-padding-inline: 18px !important;
  }
  body.apd736-release .apd557-experience-picker a,
  body.apd736-release .apd23-service-category-rail > a {
    flex-basis: 132px !important;
    width: 132px !important;
    min-width: 132px !important;
    min-height: 172px !important;
    padding: 9px 7px 12px !important;
  }
  body.apd736-release .apd557-experience-picker-media,
  body.apd736-release .apd23-service-category-rail .apd188-service-category-media {
    flex-basis: 118px !important;
    width: 118px !important;
    height: 118px !important;
    min-width: 118px !important;
    min-height: 118px !important;
  }
  body.apd736-release .apd557-experience-picker-media > img,
  body.apd736-release .apd23-service-category-rail .apd188-service-category-media > img {
    width: 116px !important;
    height: 116px !important;
  }
  body.apd736-release .apd557-experience-picker strong,
  body.apd736-release .apd23-service-category-rail > a > strong {
    font-size: 14px !important;
  }
  html body.single-listing.apd736-release .apd647-host-info .apd177-host-note {
    grid-template-columns: 82px minmax(0,1fr) !important;
    gap: 15px !important;
    padding: 17px !important;
  }
  html body.single-listing.apd736-release .apd647-host-info .apd177-host-note-icon,
  html body.single-listing.apd736-release .apd647-host-info .apd177-host-note-icon > img {
    width: 78px !important;
    height: 78px !important;
    max-width: 78px !important;
    max-height: 78px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.apd736-release .apd736-mode-loader i { animation: none !important; opacity: .85 !important; }
  body.apd736-release .apd557-experience-picker a,
  body.apd736-release .apd23-service-category-rail > a { transition: none !important; }
}