/* SD Tour Virtuali | AGENZIA V10 | SKIN MATTERPORT TEST 01
   Presentational module only. No Marzipano scene/hotspot/walking logic changes.
   All selectors are scoped to .sd-mp-skin so the original V10 is recoverable. */
body.sd-mp-skin {
  --sd-mp-size: 38px;
  --sd-mp-gap: 4px;
  --sd-mp-bg: rgba(51, 51, 51, .70);
  --sd-mp-border: hsla(0, 0%, 43.9%, .50);
  --sd-mp-hover: rgba(0, 0, 0, .67);
  --sd-mp-focus: #fff;
  font-family: Roboto, Arial, Helvetica, sans-serif;
}
body.sd-mp-skin #sdMpTop {
  position: fixed; inset: 0 0 auto; height: 132px;
  padding: max(8px, env(safe-area-inset-top, 0px)) 12px 24px;
  z-index: 35; pointer-events: none;
  background: linear-gradient(180deg, rgba(0,0,0,.52), rgba(0,0,0,.15) 64%, transparent);
  display: flex; flex-direction: column; align-items: flex-start;
}
body.sd-mp-skin #sdMpTop > * { pointer-events: auto; }
body.sd-mp-skin #sdMpTop #agencyContact {
  position: relative !important; inset: auto !important;
  display: block; width: auto; max-width: min(220px, 80vw);
  z-index: 2; line-height: 1;
}
body.sd-mp-skin #sdMpTop #agencyContact #brandLogo {
  position: static !important; display: flex !important;
  width: auto !important; height: auto !important;
  min-height: 36px; max-width: 188px;
  align-items: center; justify-content: center;
  padding: 5px 8px !important;
  background: var(--sd-mp-bg) !important;
  border: 1px solid var(--sd-mp-border) !important;
  border-radius: 11px !important;
  backdrop-filter: blur(5px) !important;
  -webkit-backdrop-filter: blur(5px) !important;
  box-shadow: none !important;
}
body.sd-mp-skin #agencyContact #brandLogo .brandLogoImage {
  display: block !important; width: auto !important;
  max-width: 140px !important; max-height: 48px !important;
  height: auto !important; object-fit: contain;
}
body.sd-mp-skin #agencyContact .agencySocialPanel {
  right: auto !important; left: 0 !important;
  bottom: auto !important; top: calc(100% + 8px) !important;
  z-index: 56;
}
body.sd-mp-skin #sdMpTop #titleBar,
body.sd-mp-skin.fullscreen-enabled #sdMpTop #titleBar,
body.sd-mp-skin.multiple-scenes #sdMpTop #titleBar,
body.sd-mp-skin.mobile #sdMpTop #titleBar,
body.sd-mp-skin.fullscreen-enabled.mobile #sdMpTop #titleBar,
body.sd-mp-skin.multiple-scenes.mobile #sdMpTop #titleBar {
  display: block !important;
  position: static !important; inset: auto !important;
  width: auto !important; height: auto !important;
  max-width: min(360px, calc(100vw - 24px));
  margin-top: 5px !important; padding: 0 !important;
  text-align: left !important; transform: none !important;
}
body.sd-mp-skin #sdMpTop #titleBar .tourAddress {
  box-sizing: border-box;
  display: flex !important; width: auto !important;
  min-height: 24px !important; height: auto !important;
  max-width: 100%; padding: 2px 5px !important;
  justify-content: flex-start !important; gap: 5px !important;
  background: transparent !important; border: 0 !important;
  border-radius: 0 !important; box-shadow: none !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
body.sd-mp-skin #sdMpTop .tourAddressIcon {
  width: 15px !important; height: 15px !important;
  opacity: .95;
}
body.sd-mp-skin #sdMpTop #titleBar .sceneName {
  display: block; width: auto; max-width: 100%; height: auto !important;
  line-height: 1.35 !important; padding: 0 !important;
  font-size: 12px; font-weight: 500; letter-spacing: .2px;
  color: #f5f4f3 !important; text-shadow: 0 1px 2px rgba(0,0,0,.4);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
body.sd-mp-skin #sdMpBottomShade {
  position: fixed; z-index: 24;
  inset: auto 0 0; height: 96px;
  background-image: linear-gradient(0deg, rgba(0,0,0,.30), rgba(0,0,0,.26) 31.82%, rgba(0,0,0,.10) 63.66%, transparent);
  pointer-events: none;
}
body.sd-mp-skin #sdMpDock {
  position: fixed;
  left: max(10px, env(safe-area-inset-left,0px));
  bottom: calc(10px + env(safe-area-inset-bottom,0px));
  display: flex; align-items: center; gap: var(--sd-mp-gap);
  padding: 0; margin: 0; z-index: 39;
  pointer-events: auto;
}
/* Existing anchors are MOVED here (not cloned); their event listeners remain intact. */
body.sd-mp-skin #sdMpDock #sceneListToggle,
body.sd-mp-skin #sdMpDock #minimapToggle,
body.sd-mp-skin #sdMpDock #fullscreenToggle,
body.sd-mp-skin #sdMpDock #autorotateToggle,
body.sd-mp-skin #sdMpDock #sdMpMaps,
body.sd-mp-skin #sdMpDock #sdMpMore,
body.sd-mp-skin #sdMpOverflow .sd-mp-overflow-action,
body.sd-mp-skin #sdMpSocial a {
  display: inline-flex !important;
  position: relative !important;
  inset: auto !important;
  width: var(--sd-mp-size) !important;
  height: var(--sd-mp-size) !important;
  min-width: var(--sd-mp-size) !important;
  flex: 0 0 var(--sd-mp-size);
  align-items: center !important; justify-content: center !important;
  box-sizing: border-box;
  margin: 0 !important; padding: 0 !important;
  color: white !important;
  background: var(--sd-mp-bg) !important;
  border: 1px solid var(--sd-mp-border) !important;
  border-radius: 100px !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(5px) !important;
  backdrop-filter: blur(5px) !important;
  transform: none !important;
  transition: background-color .5s, color .5s, border-color .5s;
  text-decoration: none !important; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  overflow: hidden;
}
body.sd-mp-skin #sdMpDock a .icon { display: none !important; }
body.sd-mp-skin .sd-mp-glyph,
body.sd-mp-skin .sd-mp-glyph svg {
  display: block; width: 18px; height: 18px;
  pointer-events: none; flex: 0 0 auto;
}
body.sd-mp-skin #sdMpDock a.enabled:not([aria-disabled="true"]) {
  background: rgba(20,22,25,.88) !important;
  border-color: rgba(255,255,255,.80) !important;
}
body.sd-mp-skin #sdMpDock [aria-disabled="true"],
body.sd-mp-skin #sdMpDock .sd-mp-disabled {
  opacity: .45; cursor: not-allowed; filter: grayscale(.6);
}
body.sd-mp-skin #sdMpDock [aria-disabled="true"]:hover,
body.sd-mp-skin #sdMpDock .sd-mp-disabled:hover { background: var(--sd-mp-bg) !important; }
@media (hover: hover) {
  body.sd-mp-skin #sdMpDock a:hover:not([aria-disabled="true"]):not(.sd-mp-disabled),
  body.sd-mp-skin #sdMpDock button:hover,
  body.sd-mp-skin #sdMpSocial a:hover {
    background: var(--sd-mp-hover) !important;
    border-color: white !important;
  }
}
body.sd-mp-skin #sdMpDock a:focus-visible,
body.sd-mp-skin #sdMpDock button:focus-visible,
body.sd-mp-skin #sdMpSocial a:focus-visible,
body.sd-mp-skin #sdMpDrawerClose:focus-visible {
  outline: 2px solid var(--sd-mp-focus); outline-offset: 3px;
}
body.sd-mp-skin #sdMpSocial {
  position: fixed; z-index: 39; pointer-events: auto;
  right: max(10px, env(safe-area-inset-right,0px));
  bottom: calc(10px + env(safe-area-inset-bottom,0px));
  display: flex; align-items: center; gap: 4px;
}
body.sd-mp-skin #sdMpSocial a img {
  display: block; width: 21px; height: 21px;
  object-fit: contain; pointer-events: none;
}
body.sd-mp-skin #sdMpMore { display: none !important; }
body.sd-mp-skin #sdMpOverflow {
  display: none; position: fixed; z-index: 48;
  left: max(10px, env(safe-area-inset-left,0px));
  bottom: calc(62px + env(safe-area-inset-bottom,0px));
  min-width: 172px; padding: 8px;
  background: rgba(32,35,39,.94); border: 1px solid rgba(255,255,255,.25);
  border-radius: 14px; box-shadow: 0 4px 18px rgba(0,0,0,.3);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
}
body.sd-mp-skin #sdMpOverflow.enabled { display: flex; flex-direction: column; gap: 5px; }
body.sd-mp-skin #sdMpOverflow .sd-mp-overflow-action {
  width: 100% !important; height: 42px !important;
  border-radius: 9px !important; justify-content: flex-start !important;
  padding: 0 10px !important; gap: 10px;
  flex: none; font: 500 13px Roboto,Arial,sans-serif;
}
body.sd-mp-skin #sdMpOverflow .sd-mp-overflow-action svg { width: 18px; height: 18px; }
body.sd-mp-skin #sdMpRoomToast {
  position: fixed; z-index: 34; pointer-events: none;
  left: 50%; top: 15%; transform: translate(-50%, -6px);
  max-width: min(320px,calc(100vw - 40px));
  padding: 10px 18px; border-radius: 100px;
  background: rgba(20,22,25,.75); color: #fff;
  border: 1px solid rgba(255,255,255,.25);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  text-align: center; font: 500 14px/1.25 Roboto,Arial,sans-serif;
  text-shadow: 0 1px 2px rgba(0,0,0,.4);
  opacity: 0; transition: opacity .3s ease, transform .3s ease;
}
body.sd-mp-skin #sdMpRoomToast.enabled {
  opacity: 1; transform: translate(-50%,0);
}
/* Existing thumbnail gallery becomes a compact floating drawer, not a full-page takeover. */
body.sd-mp-skin #sceneList,
body.sd-mp-skin.mobile #sceneList {
  position: fixed !important; z-index: 38 !important;
  top: 102px !important; bottom: auto !important;
  left: max(10px, env(safe-area-inset-left,0px)) !important;
  width: min(328px, calc(100vw - 30px)) !important;
  height: min(540px,calc(100vh - 182px)) !important;
  height: min(540px,calc(100dvh - 182px)) !important;
  max-height: none !important;
  padding: 0 !important; margin: 0 !important;
  background: rgba(32,35,39,.94) !important;
  border: 1px solid rgba(255,255,255,.24);
  border-radius: 16px !important;
  box-shadow: 0 8px 28px rgba(0,0,0,.32);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  display: flex !important; flex-direction: column;
  overflow: hidden !important;
  transform: translateX(calc(-100% - 40px)) !important;
  visibility: hidden !important; pointer-events: none !important;
  transition: transform .32s ease, visibility 0s linear .32s;
}
body.sd-mp-skin #sceneList.enabled,
body.sd-mp-skin.mobile #sceneList.enabled {
  transform: translateX(0) !important;
  visibility: visible !important; pointer-events: auto !important;
  transition: transform .32s ease, visibility 0s;
}
body.sd-mp-skin #sdMpDrawerHeader {
  flex: 0 0 48px; display: flex;
  align-items: center; justify-content: space-between;
  padding: 0 10px 0 15px; font: 600 14px Roboto,Arial,sans-serif;
  border-bottom: 1px solid rgba(255,255,255,.14);
}
body.sd-mp-skin #sdMpDrawerClose {
  border: 0; border-radius: 50%; width: 36px; height: 36px;
  background: rgba(255,255,255,.1); color: #fff;
  cursor: pointer; font-size: 22px; line-height: 1;
}
body.sd-mp-skin #sceneList .scenes,
body.sd-mp-skin.mobile #sceneList .scenes {
  box-sizing: border-box; flex: 1 1 auto;
  min-height: 0; margin: 0 !important; padding: 8px 18px 14px 9px !important;
  overflow-y: auto !important; overflow-x: hidden !important;
  height: auto !important; max-height: none !important;
  background: transparent !important; border: 0 !important;
  box-shadow: none !important; backdrop-filter: none !important;
}
body.sd-mp-skin #sceneList .scene.current,
body.sd-mp-skin.mobile #sceneList .scene.current {
  border: 2px solid rgba(255,255,255,.9) !important;
  background: rgba(255,255,255,.06) !important;
}
/* The original scrollbar lives in the scene drawer; leave the Marzipano script unchanged. */
body.sd-mp-skin #sceneList .sceneScrollBar { pointer-events: auto; }
/* Very narrow screens: move two nonessential controls to an accessible overflow menu. */
@media (max-width: 280px) {
  body.sd-mp-skin #sdMpDock #autorotateToggle,
  body.sd-mp-skin #sdMpDock #sdMpMaps { display: none !important; }
  body.sd-mp-skin #sdMpDock #sdMpMore { display: inline-flex !important; }
}
/* Touch layouts use thumb-sized targets and put social links on a second line. */
@media (max-width: 700px), (max-height: 600px) and (pointer: coarse) {
  body.sd-mp-skin { --sd-mp-size: 44px; }
  body.sd-mp-skin #sdMpDock { gap: 5px; }
  body.sd-mp-skin #sdMpDock .sd-mp-glyph,
  body.sd-mp-skin #sdMpDock .sd-mp-glyph svg { width: 21px; height: 21px; }
  body.sd-mp-skin #sdMpSocial {
    bottom: calc(65px + env(safe-area-inset-bottom,0px));
  }
  body.sd-mp-skin #sdMpTop { height: 118px; }
  body.sd-mp-skin #sdMpTop #agencyContact #brandLogo { min-height: 36px; }
  body.sd-mp-skin #agencyContact #brandLogo .brandLogoImage {
    max-width: 110px !important; max-height: 40px !important;
  }
  body.sd-mp-skin #sdMpRoomToast { top: 28%; }
}
@media (max-height: 600px) and (pointer: coarse) {
  body.sd-mp-skin #sdMpTop {
    height: 80px; padding-top: max(4px, env(safe-area-inset-top,0px));
  }
  body.sd-mp-skin #sdMpTop #agencyContact #brandLogo { padding: 3px 5px !important; min-height: 29px; }
  body.sd-mp-skin #agencyContact #brandLogo .brandLogoImage { max-height: 27px !important; max-width: 94px !important; }
  body.sd-mp-skin #sdMpTop #titleBar { margin-top: 2px !important; }
  body.sd-mp-skin #sceneList,
  body.sd-mp-skin.mobile #sceneList {
    top: 75px !important;
    height: calc(100vh - 140px) !important;
    height: calc(100dvh - 140px) !important;
  }
  body.sd-mp-skin #sdMpSocial { bottom: calc(60px + env(safe-area-inset-bottom,0px)); }
}
@media (prefers-reduced-motion: reduce) {
  body.sd-mp-skin #sdMpRoomToast, body.sd-mp-skin #sceneList { transition-duration: .01ms !important; }
}

/* ================================================================
   SD Matterport SKIN V2 | corrections agreed after iPhone comparison.
   One control per action, responsive socials, rounded pill gallery.
   ================================================================ */
/* Old social panel is permanently disabled in this experimental skin. */
body.sd-mp-skin #agencySocialPanel { display: none !important; }
body.sd-mp-skin #sdMpTop .sceneName:not([href]) { cursor: default !important; text-decoration: none !important; }
/* Unsupported fullscreen: remove button completely, not just fade. */
body.sd-mp-skin #sdMpDock #fullscreenToggle.sd-mp-unavailable { display: none !important; }
/* No more overflow menu in dock. Three-dot button is social-only and on phones. */
body.sd-mp-skin #sdMpDock #sdMpMore, body.sd-mp-skin #sdMpOverflow { display: none !important; }
body.sd-mp-skin #sdMpSocial { bottom: calc(10px + env(safe-area-inset-bottom,0px)); }
body.sd-mp-skin #sdMpSocialLinks { display:flex; align-items:center; gap: 4px; }
body.sd-mp-skin #sdMpSocialLinks a,
body.sd-mp-skin #sdMpSocial #sdMpMore {
  display: inline-flex; width:var(--sd-mp-size); height:var(--sd-mp-size);
  min-width:var(--sd-mp-size); flex:0 0 var(--sd-mp-size);
  align-items:center; justify-content:center; box-sizing:border-box;
  background:var(--sd-mp-bg); border:1px solid var(--sd-mp-border);
  border-radius:100px; padding:0; color:white;
  backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px);
  text-decoration:none;
}
body.sd-mp-skin #sdMpSocial #sdMpMore { display:none; cursor:pointer; }
body.sd-mp-skin #sdMpSocial #sdMpMore .sd-mp-glyph svg { width:21px; height:21px; }
/* Gallery: Matterport-inspired dark pill drawer, white-selected scene. */
body.sd-mp-skin #sceneList, body.sd-mp-skin.mobile #sceneList {
  width:min(344px, calc(100vw - 24px)) !important;
  border-radius:30px !important;
  background:rgba(39,39,40,.91) !important;
  border:1px solid rgba(255,255,255,.22) !important;
  backdrop-filter:blur(12px) !important; -webkit-backdrop-filter:blur(12px) !important;
}
body.sd-mp-skin #sdMpDrawerHeader { font-size:19px; font-weight:650; border-bottom:0; flex-basis:58px; padding:4px 14px 0 20px; }
body.sd-mp-skin #sdMpDrawerClose { width:39px; height:39px; font-size:25px; }
body.sd-mp-skin #sceneList .scenes, body.sd-mp-skin.mobile #sceneList .scenes {
  padding:4px 13px 16px !important;
}
body.sd-mp-skin #sceneList .scene, body.sd-mp-skin.mobile #sceneList .scene {
  display:flex !important; flex-direction:row !important; align-items:center !important;
  box-sizing:border-box !important; width:100% !important;
  height:66px !important; min-height:66px !important;
  margin:4px 0 !important; padding:4px 12px 4px 5px !important;
  border-radius:100px !important; border:1px solid rgba(255,255,255,.10) !important;
  background:rgba(255,255,255,.055) !important; gap:12px !important;
  transform:none !important; overflow:hidden !important;
}
body.sd-mp-skin #sceneList .sceneThumb, body.sd-mp-skin.mobile #sceneList .sceneThumb {
  display:block !important; box-sizing:border-box !important;
  width:56px !important; height:56px !important; flex:0 0 56px !important;
  border-radius:50% !important; object-fit:cover !important;
  box-shadow:none !important;
}
body.sd-mp-skin #sceneList .scene .text, body.sd-mp-skin.mobile #sceneList .scene .text {
  position:static !important; display:block !important;
  padding:0 !important; margin:0 !important; flex:1 1 auto !important;
  min-width:0 !important; color:#f5f5f5 !important;
  font-size:14px !important; font-weight:500 !important; line-height:1.25 !important;
  background:none !important; text-align:left !important;
}
body.sd-mp-skin #sceneList .scene .text::before,
body.sd-mp-skin #sceneList .scene .text::after { display:none !important; }
body.sd-mp-skin #sceneList .scene::after {
  content:'›'; flex:0 0 14px; font-size:25px; font-weight:300;
  color:rgba(255,255,255,.86); line-height:1;
}
body.sd-mp-skin #sceneList .scene.current, body.sd-mp-skin.mobile #sceneList .scene.current {
  border:2px solid rgba(255,255,255,.96) !important;
  background:#fafafa !important;
  padding-left:4px !important;
  box-shadow:0 3px 12px rgba(0,0,0,.21);
}
body.sd-mp-skin #sceneList .scene.current .text,
body.sd-mp-skin.mobile #sceneList .scene.current .text {
  color:#303235 !important; font-weight:700 !important;
}
body.sd-mp-skin #sceneList .scene.current::after { color:#303235 !important; }
body.sd-mp-skin #sceneList .scene.current .sceneThumb { box-shadow:0 0 0 1px rgba(55,55,55,.15) !important; }
@media (hover:hover) {
  body.sd-mp-skin #sceneList .scene:hover:not(.current) { background:rgba(255,255,255,.15) !important; }
}
/* Narrow layouts: preserve usable gallery while leaving bottom commands unobscured. */
@media (max-width:700px) {
  body.sd-mp-skin #sceneList, body.sd-mp-skin.mobile #sceneList {
    width:min(344px,calc(100vw - 24px)) !important;
    height:min(540px,calc(100dvh - 180px)) !important;
  }
}
/* Phone portrait AND landscape (coarse-pointer devices, not tablets). */
@media (max-width:700px) and (pointer:coarse),
       (max-height:500px) and (max-width:1024px) and (pointer:coarse) {
  body.sd-mp-skin #sdMpSocial { bottom:calc(10px + env(safe-area-inset-bottom,0px)); }
  body.sd-mp-skin #sdMpSocial #sdMpMore { display:inline-flex !important; }
  body.sd-mp-skin #sdMpSocialLinks {
    display:none !important; position:absolute; right:0;
    bottom:calc(100% + 9px); width:auto; padding:9px;
    border-radius:24px; background:rgba(37,38,41,.94);
    border:1px solid rgba(255,255,255,.25);
    box-shadow:0 5px 16px rgba(0,0,0,.3);
    backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
    flex-direction:column; align-items:center; gap:8px;
  }
  body.sd-mp-skin #sdMpSocial.enabled #sdMpSocialLinks { display:flex !important; }
  body.sd-mp-skin #sdMpSocialLinks a { width:44px !important; height:44px !important; min-width:44px !important; flex:0 0 44px !important; }
  body.sd-mp-skin #sdMpDock { max-width:calc(100vw - 80px); }
}
@media (max-height:500px) and (max-width:1024px) and (pointer:coarse) {
  body.sd-mp-skin #sceneList, body.sd-mp-skin.mobile #sceneList {
    top:70px !important; height:calc(100dvh - 135px) !important;
  }
}


/* ==============================================================
   SD Matterport TEST 03 | Layout, proportions, and interaction
   Non-destructive override. No changes to Marzipano/hotspot logic.
   ============================================================== */
body.sd-mp-skin {
  --sd-mp-bg: rgba(51,51,51,.70);
  --sd-mp-size: 54px;
  --sd-mp-gap: 8px;
  --sd-mp-hover: var(--sd-mp-bg);
}
/* PC: logo and address balanced at opposite top corners. */
body.sd-mp-skin #sdMpTop {
  height: 104px; display:flex; flex-direction:row;
  align-items:flex-start; justify-content:space-between; gap:16px;
  padding:10px 15px 20px;
}
body.sd-mp-skin #sdMpTop #agencyContact { flex:0 1 auto; max-width:38%; }
body.sd-mp-skin #sdMpTop #agencyContact #brandLogo {
  min-height:54px; height:54px !important; padding:5px 12px !important;
  border-radius:14px !important; max-width:260px;
}
body.sd-mp-skin #agencyContact #brandLogo .brandLogoImage {
  max-height:42px !important; max-width:224px !important;
}
body.sd-mp-skin #sdMpTop #titleBar,
body.sd-mp-skin.fullscreen-enabled #sdMpTop #titleBar,
body.sd-mp-skin.multiple-scenes #sdMpTop #titleBar,
body.sd-mp-skin.mobile #sdMpTop #titleBar {
  flex:0 1 auto; margin-top:0 !important;
  max-width: min(46vw,560px) !important;
  text-align:right !important;
}
body.sd-mp-skin #sdMpTop #titleBar .tourAddress {
  justify-content:flex-end !important; min-height:54px !important;
  padding:5px 10px !important; border-radius:14px !important;
  background:var(--sd-mp-bg) !important;
  border:1px solid var(--sd-mp-border) !important;
  backdrop-filter:blur(5px) !important;
  -webkit-backdrop-filter:blur(5px) !important;
}
body.sd-mp-skin #sdMpTop #titleBar .sceneName {
  font-size:14px !important; font-weight:500 !important;
  white-space:normal !important; overflow-wrap:anywhere;
  text-align:right !important;
}
body.sd-mp-skin #sdMpTop .tourAddressIcon {width:17px !important;height:17px !important;flex:0 0 17px;}
/* Consistent desktop controls. Preserve the original disabled minimap behavior. */
body.sd-mp-skin #sdMpDock .sd-mp-glyph,
body.sd-mp-skin #sdMpDock .sd-mp-glyph svg {width:25px;height:25px;}
body.sd-mp-skin #sdMpSocialLinks a img {width:25px;height:25px;}
/* Desktop social controls have no hover change, matching tour buttons. */
@media (hover:hover) {
  body.sd-mp-skin #sdMpSocial a:hover,
  body.sd-mp-skin #sdMpSocialLinks a:hover,
  body.sd-mp-skin #sdMpSocial #sdMpMore:hover {
    background:var(--sd-mp-bg) !important;
    border-color:var(--sd-mp-border) !important;
    filter:none !important; box-shadow:none !important;
  }
}
/* Gallery stays balanced with larger desktop chrome. */
body.sd-mp-skin #sceneList,
body.sd-mp-skin.mobile #sceneList {
  top:92px !important;
  width:min(320px,calc(100vw - 28px)) !important;
  height:min(530px,calc(100dvh - 174px)) !important;
  border-radius:23px !important;
  background:rgba(39,39,40,.91) !important;
}
body.sd-mp-skin #sdMpDrawerHeader {
  flex-basis:50px; font-size:16px; padding:2px 10px 0 14px;
}
body.sd-mp-skin #sdMpDrawerClose {width:36px;height:36px;font-size:23px;}
body.sd-mp-skin #sceneList .scenes,
body.sd-mp-skin.mobile #sceneList .scenes {
  padding:4px 9px 10px !important;
}
body.sd-mp-skin #sceneList .scene,
body.sd-mp-skin.mobile #sceneList .scene {
  height:52px !important; min-height:52px !important;
  padding:4px 7px !important; margin:3px 0 !important;
  gap:9px !important;
  border:1px solid var(--sd-mp-border) !important;
  border-radius:100px !important;
  background:var(--sd-mp-bg) !important;
  box-shadow:none !important;
  transition:none !important;
}
body.sd-mp-skin #sceneList .sceneThumb,
body.sd-mp-skin.mobile #sceneList .sceneThumb {
  width:76px !important; height:42px !important;
  flex:0 0 76px !important; border-radius:100px !important;
  object-fit:cover !important;
}
body.sd-mp-skin #sceneList .scene .text,
body.sd-mp-skin.mobile #sceneList .scene .text {
  font-size:13px !important; font-weight:500 !important;
  text-overflow:ellipsis !important; overflow:hidden !important;
  white-space:nowrap !important;
}
/* No right chevron: the entire existing row remains clickable. */
body.sd-mp-skin #sceneList .scene::after,
body.sd-mp-skin.mobile #sceneList .scene::after,
body.sd-mp-skin #sceneList .scene::before,
body.sd-mp-skin.mobile #sceneList .scene::before { content:none !important; display:none !important; }
body.sd-mp-skin #sceneList .scene.current,
body.sd-mp-skin.mobile #sceneList .scene.current {
  background:#fafafa !important;
  border:1px solid rgba(255,255,255,.96) !important;
  padding:4px 7px !important;
}
body.sd-mp-skin #sceneList .scene.current .text,
body.sd-mp-skin.mobile #sceneList .scene.current .text {
  color:#303235 !important; font-weight:700 !important;
}
/* States must remain constant under mouse and touch hover. */
@media (hover:hover) {
  body.sd-mp-skin #sceneList .scene:hover,
  body.sd-mp-skin.mobile #sceneList .scene:hover {
    background:var(--sd-mp-bg) !important;
    border-color:var(--sd-mp-border) !important;
  }
  body.sd-mp-skin #sceneList .scene.current:hover,
  body.sd-mp-skin.mobile #sceneList .scene.current:hover {
    background:#fafafa !important;
    border-color:rgba(255,255,255,.96) !important;
  }
}
/* Social drawer: exact palette and rounded edges of the gallery/control bar. */
body.sd-mp-skin #sdMpSocialLinks {
  background:transparent; border:0;
}
/* Tablets and narrower desktop widths: scaled presentation, no phone-only drawer. */
@media (min-width:601px) and (max-width:1100px) and (min-height:441px) {
  body.sd-mp-skin { --sd-mp-size:46px; --sd-mp-gap:6px; }
  body.sd-mp-skin #sdMpDock .sd-mp-glyph,
  body.sd-mp-skin #sdMpDock .sd-mp-glyph svg {width:22px;height:22px;}
  body.sd-mp-skin #sdMpSocialLinks a img {width:23px;height:23px;}
  body.sd-mp-skin #sdMpTop #agencyContact #brandLogo {height:49px !important;min-height:49px;}
  body.sd-mp-skin #sdMpTop #titleBar .tourAddress {min-height:49px !important;}
}
/* Phones: portrait and narrow landscape identified by available space, not browser UA. */
@media (max-width:600px) and (pointer:coarse),
       (max-height:440px) and (max-width:900px) and (pointer:coarse) {
  body.sd-mp-skin { --sd-mp-size:43px; --sd-mp-gap:4px; }
  body.sd-mp-skin #sdMpTop {height:95px; padding:8px 10px;gap:8px;}
  body.sd-mp-skin #sdMpTop #agencyContact {max-width: 44%;}
  body.sd-mp-skin #sdMpTop #agencyContact #brandLogo {
    height:43px !important;min-height:43px;max-width:170px;
    padding:4px 7px !important;
  }
  body.sd-mp-skin #agencyContact #brandLogo .brandLogoImage {
    max-height:34px !important; max-width:155px !important;
  }
  body.sd-mp-skin #sdMpTop #titleBar {
    max-width:53% !important; margin-top:0 !important;
  }
  body.sd-mp-skin #sdMpTop #titleBar .tourAddress {
    min-height:43px !important; padding:5px 7px !important;
  }
  body.sd-mp-skin #sdMpTop #titleBar .sceneName {
    font-size:11px !important;line-height:1.2 !important;
  }
  body.sd-mp-skin #sdMpTop .tourAddressIcon {width:13px !important;height:13px !important;flex-basis:13px;}
  body.sd-mp-skin #sdMpDock {gap:var(--sd-mp-gap); max-width:calc(100vw - 80px);}
  body.sd-mp-skin #sdMpDock .sd-mp-glyph,
  body.sd-mp-skin #sdMpDock .sd-mp-glyph svg {width:21px;height:21px;}
  body.sd-mp-skin #sceneList,
  body.sd-mp-skin.mobile #sceneList {
    top:87px !important; width:min(274px,calc(100vw - 86px)) !important;
    height:min(485px,calc(100dvh - 157px)) !important;
    border-radius:18px !important;
  }
  body.sd-mp-skin #sdMpDrawerHeader {flex-basis:43px;font-size:14px;padding:0 7px 0 11px;}
  body.sd-mp-skin #sdMpDrawerClose {width:32px;height:32px;font-size:21px;}
  body.sd-mp-skin #sceneList .scenes,
  body.sd-mp-skin.mobile #sceneList .scenes {padding:2px 6px 7px !important;}
  body.sd-mp-skin #sceneList .scene,
  body.sd-mp-skin.mobile #sceneList .scene {
    height:44px !important;min-height:44px !important;
    padding:3px 5px !important;margin:2px 0 !important;gap:7px !important;
  }
  body.sd-mp-skin #sceneList .sceneThumb,
  body.sd-mp-skin.mobile #sceneList .sceneThumb {
    width:65px !important;height:36px !important;flex:0 0 65px !important;
  }
  body.sd-mp-skin #sceneList .scene .text,
  body.sd-mp-skin.mobile #sceneList .scene .text {font-size:12px !important;}
  body.sd-mp-skin #sdMpSocial #sdMpMore {display:inline-flex !important;}
  body.sd-mp-skin #sdMpSocialLinks {
    display:none !important;position:absolute;right:0;bottom:calc(100% + 8px);
    width:auto;padding:8px;border-radius:20px;
    background:rgba(39,39,40,.91) !important;
    border:1px solid var(--sd-mp-border) !important;
    box-shadow:0 8px 28px rgba(0,0,0,.32);
    backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
    flex-direction:column;align-items:center;gap:6px;
  }
  body.sd-mp-skin #sdMpSocial.enabled #sdMpSocialLinks {display:flex !important;}
  body.sd-mp-skin #sdMpSocialLinks a {
    width:43px !important;height:43px !important;min-width:43px !important;flex:0 0 43px !important;
  }
}
/* Very short phone landscape: optimize usable vertical scene area, not just width. */
@media (max-height:440px) and (max-width:900px) and (pointer:coarse) {
  body.sd-mp-skin #sdMpTop {height:61px;padding:4px 9px;}
  body.sd-mp-skin #sdMpTop #agencyContact #brandLogo {height:37px !important;min-height:37px;}
  body.sd-mp-skin #agencyContact #brandLogo .brandLogoImage {max-height:29px !important;}
  body.sd-mp-skin #sdMpTop #titleBar .tourAddress {min-height:37px !important;}
  body.sd-mp-skin #sceneList,
  body.sd-mp-skin.mobile #sceneList {
    top:53px !important;
    width:min(270px,calc(100vw - 95px)) !important;
    height:max(90px,calc(100dvh - 125px)) !important;
  }
  body.sd-mp-skin #sceneList .scene,
  body.sd-mp-skin.mobile #sceneList .scene {height:39px !important;min-height:39px !important;}
  body.sd-mp-skin #sceneList .sceneThumb,
  body.sd-mp-skin.mobile #sceneList .sceneThumb {height:31px !important;width:60px !important;flex-basis:60px !important;}
  body.sd-mp-skin #sdMpDrawerHeader {flex-basis:35px;}
}
/* Extra narrow phone portrait: don't collide with upper-right address. */
@media (max-width:440px) and (min-height:441px) and (pointer:coarse) {
  body.sd-mp-skin #sdMpTop {height:109px;display:block;}
  body.sd-mp-skin #sdMpTop #agencyContact {max-width:76%;}
  body.sd-mp-skin #sdMpTop #titleBar {
    position:absolute !important;left:10px !important;right:10px !important;
    top:55px !important;max-width:calc(100vw - 20px) !important;
  }
  body.sd-mp-skin #sdMpTop #titleBar .tourAddress {
    display:inline-flex !important;justify-content:flex-start !important;
    min-height:23px !important;height:auto !important;
    padding:2px 5px !important;background:transparent !important;
    border:0 !important;backdrop-filter:none !important;
  }
  body.sd-mp-skin #sdMpTop #titleBar .sceneName {
    text-align:left !important; font-size:12px !important;
  }
  body.sd-mp-skin #sceneList,
  body.sd-mp-skin.mobile #sceneList {top:95px !important;}
}
@media (prefers-reduced-motion:reduce) {
 body.sd-mp-skin #sceneList .scene {transition:none !important;}
}


/* ====================================================================
 SD / TEST 04 — overrides verified against V10 + TEST 03 source files.
 Preserve scene and hotspot runtime; only presentation is changed.
 ==================================================================== */
body.sd-mp-skin { --sd-mp-row-bg: rgba(112,112,112,.72); --sd-mp-width: 236px; }
/* Matterport header: no containers around either logo or address. */
body.sd-mp-skin #sdMpTop #agencyContact,
body.sd-mp-skin #sdMpTop #agencyContact #brandLogo,
body.sd-mp-skin #sdMpTop #titleBar,
body.sd-mp-skin #sdMpTop #titleBar .tourAddress {
  background: transparent !important; background-color: transparent !important;
  border: 0 !important; box-shadow: none !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
body.sd-mp-skin #sdMpTop #agencyContact #brandLogo {
  padding:0 !important; border-radius:0 !important;
  width:auto !important; min-height:54px !important;
  height:54px !important; display:flex !important; justify-content:flex-start !important;
}
body.sd-mp-skin #agencyContact #brandLogo .brandLogoImage {
  max-height:54px !important; max-width:min(240px,36vw) !important;
  width:auto !important; object-fit:contain !important;
}
body.sd-mp-skin #sdMpTop #titleBar .tourAddress {
  padding:0 !important; min-height:54px !important; border-radius:0 !important;
  display:flex !important; align-items:flex-start !important;
}
body.sd-mp-skin #sdMpTop #titleBar .sceneName,
body.sd-mp-skin #sdMpTop .tourAddressIcon {
  text-shadow:0 1px 3px rgba(0,0,0,.8),0 0 8px rgba(0,0,0,.32) !important;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.25));
}
body.sd-mp-skin #sdMpTop #titleBar .sceneName {font-size:14px !important; font-weight:500 !important;}
/* Gallery fits its content: shared width based on longest room name. */
body.sd-mp-skin #sceneList,
body.sd-mp-skin.mobile #sceneList {
  width:min(var(--sd-mp-width),calc(100vw - 24px)) !important;
  max-width:calc(100vw - 24px) !important;
  border-radius:19px !important;
}
body.sd-mp-skin #sceneList .scenes,
body.sd-mp-skin.mobile #sceneList .scenes {
  padding:3px 7px 8px !important;
  scrollbar-width:thin;
}
/* The entire pill gets the light gray of the previous hover state, permanently. */
body.sd-mp-skin #sceneList .scene,
body.sd-mp-skin.mobile #sceneList .scene,
body.sd-mp-skin #sceneList .scene:hover,
body.sd-mp-skin.mobile #sceneList .scene:hover,
body.sd-mp-skin #sceneList .scene:focus,
body.sd-mp-skin.mobile #sceneList .scene:focus,
body.sd-mp-skin #sceneList .scene:active,
body.sd-mp-skin.mobile #sceneList .scene:active {
  background:var(--sd-mp-row-bg) !important;
  background-color:var(--sd-mp-row-bg) !important;
  border:1px solid rgba(255,255,255,.16) !important;
  color:#fff !important;
  box-shadow:none !important; filter:none !important;
  transition:none !important;
}
body.sd-mp-skin #sceneList .scene .text,
body.sd-mp-skin.mobile #sceneList .scene .text,
body.sd-mp-skin #sceneList .scene:hover .text,
body.sd-mp-skin.mobile #sceneList .scene:hover .text {
  color:#fff !important; font-weight:500 !important; text-shadow:none !important;
}
/* Selected row must remain white under every interaction state (touch hover included). */
body.sd-mp-skin #sceneList .scene.current,
body.sd-mp-skin.mobile #sceneList .scene.current,
body.sd-mp-skin #sceneList .scene.current:hover,
body.sd-mp-skin.mobile #sceneList .scene.current:hover,
body.sd-mp-skin #sceneList .scene.current:focus,
body.sd-mp-skin.mobile #sceneList .scene.current:focus,
body.sd-mp-skin #sceneList .scene.current:active,
body.sd-mp-skin.mobile #sceneList .scene.current:active {
  background:#fafafa !important; background-color:#fafafa !important;
  border:1px solid rgba(255,255,255,.96) !important;
  color:#303235 !important; box-shadow:none !important; filter:none !important;
}
body.sd-mp-skin #sceneList .scene.current .text,
body.sd-mp-skin.mobile #sceneList .scene.current .text,
body.sd-mp-skin #sceneList .scene.current:hover .text,
body.sd-mp-skin.mobile #sceneList .scene.current:hover .text,
body.sd-mp-skin #sceneList .scene.current:focus .text,
body.sd-mp-skin.mobile #sceneList .scene.current:focus .text,
body.sd-mp-skin #sceneList .scene.current:active .text,
body.sd-mp-skin.mobile #sceneList .scene.current:active .text {
  color:#303235 !important; font-weight:700 !important;
}
body.sd-mp-skin #sceneList .scene::before,
body.sd-mp-skin #sceneList .scene::after {content:none !important;display:none !important;}
/* Original scrollbar/scrolling survives. No graphical arrows in rows. */
body.sd-mp-skin #sceneList .sceneScrollBar {right:2px !important;}
/* Social links: separate circles, same background as function buttons, never hover-tint. */
body.sd-mp-skin #sdMpSocial #sdMpSocialLinks {
  background:transparent !important; border:0 !important;
  box-shadow:none !important; backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
body.sd-mp-skin #sdMpSocialLinks a,
body.sd-mp-skin #sdMpSocialLinks a:hover,
body.sd-mp-skin #sdMpSocialLinks a:active,
body.sd-mp-skin #sdMpSocialLinks a:focus,
body.sd-mp-skin #sdMpSocial #sdMpMore,
body.sd-mp-skin #sdMpSocial #sdMpMore:hover,
body.sd-mp-skin #sdMpSocial #sdMpMore:active {
  background:var(--sd-mp-bg) !important;
  border:1px solid var(--sd-mp-border) !important;
  box-shadow:none !important; filter:none !important;
  transition:none !important; transform:none !important;
}
body.sd-mp-skin #sdMpSocial #sdMpMore {
  padding:0 !important; line-height:0 !important;
  align-items:center !important; justify-content:center !important;
  place-items:center !important;
}
body.sd-mp-skin #sdMpSocial #sdMpMore .sd-mp-glyph {
  line-height:0 !important; display:flex !important;
  width:22px !important; height:22px !important;
  align-items:center !important; justify-content:center !important;
  margin:0 !important; padding:0 !important;
}
body.sd-mp-skin #sdMpSocial #sdMpMore .sd-mp-glyph svg {
  width:22px !important; height:22px !important; display:block !important;
  flex:none !important;
}
/* Narrow phones: gallery aligned to labels rather than fixed old panel width. */
@media (max-width:600px) and (pointer:coarse),
       (max-height:440px) and (max-width:900px) and (pointer:coarse) {
  body.sd-mp-skin #sdMpTop #agencyContact #brandLogo {
    height:43px !important;min-height:43px !important;padding:0 !important;
  }
  body.sd-mp-skin #agencyContact #brandLogo .brandLogoImage {
    max-height:43px !important; max-width:min(170px,44vw) !important;
  }
  body.sd-mp-skin #sdMpTop #titleBar .tourAddress {
    background:transparent !important; border:0 !important;
    padding:0 !important;min-height:30px !important;
  }
  body.sd-mp-skin #sceneList,
  body.sd-mp-skin.mobile #sceneList {
    width:min(var(--sd-mp-width),calc(100vw - 22px)) !important;
    max-width:calc(100vw - 22px) !important;
  }
  body.sd-mp-skin #sdMpSocialLinks {
    display:none !important;
    position:absolute !important;
    right:0 !important;
    bottom:calc(100% + 9px) !important;
    width:max-content !important;
    flex-direction:row !important;
    align-items:center !important;
    gap:6px !important;
    padding:0 !important;
    border-radius:0 !important;
  }
  body.sd-mp-skin #sdMpSocial.enabled #sdMpSocialLinks {
    display:flex !important; flex-direction:row !important;
  }
  body.sd-mp-skin #sdMpSocialLinks a {margin:0 !important;}
}
/* Landscape short screens: preserve scene and controls. */
@media (max-height:440px) and (max-width:900px) and (pointer:coarse) {
  body.sd-mp-skin #sceneList,
  body.sd-mp-skin.mobile #sceneList {
    width:min(var(--sd-mp-width),calc(100vw - 22px)) !important;
    top:53px !important;
    height:max(90px,calc(100dvh - 125px)) !important;
  }
  body.sd-mp-skin #sdMpTop #agencyContact #brandLogo {
    min-height:37px !important;height:37px !important;
  }
  body.sd-mp-skin #agencyContact #brandLogo .brandLogoImage {
    max-height:37px !important;
  }
}


/* ============================================================
   TEST 05 - refinement only: scrollbar gutter and static plan modal.
   No hotspot, scene navigation, or panorama layout changes.
   ============================================================ */
/* The V10 desktop/tablet uses a custom 6px scrollbar sitting on the
   right edge of #sceneList. Reserve a real gutter INSIDE the scene list
   to avoid the thumb touching the rounded room capsules. */
body.sd-mp-skin:not(.mobile) #sceneList .scenes,
body.sd-mp-skin.desktop #sceneList .scenes {
  padding-right: 24px !important;
}
body.sd-mp-skin:not(.mobile) #sceneList .sceneScrollBar,
body.sd-mp-skin.desktop #sceneList .sceneScrollBar {
  right: 6px !important;
}
/* Tablet browsers may mark the body as mobile while still showing the
   desktop custom scrollbar. Keep the gap there as well. */
@media (min-width: 601px) and (pointer: coarse) {
  body.sd-mp-skin.mobile #sceneList .scenes {
    padding-right: 24px !important;
  }
  body.sd-mp-skin.mobile #sceneList .sceneScrollBar {
    right: 6px !important;
  }
}
/* Preserve the same compact list on phones; only give native scrolling
   a little breathing room if it happens to be displayed by the browser. */
@media (max-width: 600px) and (pointer: coarse) {
  body.sd-mp-skin #sceneList .scenes,
  body.sd-mp-skin.mobile #sceneList .scenes {
    padding-right: 11px !important;
  }
}
/* Static floor-plan window belongs to the same visual family as
   the 'Ambienti' panel. Its content stays strictly static. */
body.sd-mp-skin #minimapPanel .minimapWindow {
  box-sizing: border-box !important;
  border-radius: 19px !important;
  border: 1px solid rgba(255,255,255,.19) !important;
  background: rgba(39,39,40,.93) !important;
  color: #fff !important;
  box-shadow: 0 18px 60px rgba(0,0,0,.38) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  backdrop-filter: blur(12px) !important;
}
body.sd-mp-skin #minimapPanel .minimapHeader {
  height: 42px !important;
  flex: 0 0 42px !important;
  display: flex !important;
  align-items: center !important;
  font-family: Roboto, Arial, sans-serif !important;
  font-size: 16px !important;
  font-weight: 650 !important;
  padding: 0 45px 0 4px !important;
  gap: 8px !important;
}
body.sd-mp-skin #minimapPanel #minimapClose {
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 36px !important;
  height: 36px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,.12) !important;
  color: #fff !important;
  box-shadow: none !important;
  transform: none !important;
  transition: none !important;
  font: 400 23px/1 Roboto, Arial, sans-serif !important;
  cursor: pointer !important;
}
body.sd-mp-skin #minimapPanel #minimapClose:hover,
body.sd-mp-skin #minimapPanel #minimapClose:active {
  background: rgba(255,255,255,.12) !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}
body.sd-mp-skin #minimapPanel #minimapClose:focus-visible {
  outline: 2px solid white !important;
  outline-offset: 2px !important;
}
@media (max-width: 600px) and (pointer: coarse),
       (max-height: 440px) and (max-width: 900px) and (pointer: coarse) {
  body.sd-mp-skin #minimapPanel .minimapHeader {
    height: 36px !important;
    flex-basis: 36px !important;
    padding-right: 40px !important;
    font-size: 14px !important;
  }
  body.sd-mp-skin #minimapPanel #minimapClose {
    top: 9px !important;
    right: 9px !important;
    width: 32px !important;
    height: 32px !important;
    font-size: 21px !important;
  }
}