/* Egypt Villas - Unit Gallery Polish Bridge v7
   Scope: public unit gallery only. No API/SEO/Broker/Save changes. */

#tab-unit .unit-media-card,
#tab-unit .unit-photo-main {
  min-width: 0;
}

#tab-unit .unit-photo-main {
  position: relative !important;
  width: 100% !important;
  aspect-ratio: 16 / 10 !important;
  min-height: 280px !important;
  max-height: 620px !important;
  overflow: hidden !important;
  border-radius: 22px !important;
  background: #07111b !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  isolation: isolate !important;
  cursor: zoom-in !important;
  touch-action: manipulation !important;
}

#tab-unit .unit-photo-main > img,
#tab-unit .unit-photo-main > video,
#tab-unit #unitHeroImg,
#tab-unit #unitHeroVideo {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: #07111b !important;
  border-radius: inherit !important;
  display: block;
}

#tab-unit .unit-photo-main .unitid {
  z-index: 8 !important;
}

#tab-unit .unit-gallery-arrow {
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 12 !important;
  width: 58px !important;
  height: 58px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(234,217,161,.58) !important;
  background: rgba(7,17,27,.78) !important;
  color: #fff !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.34) !important;
  font-size: 48px !important;
  font-weight: 900 !important;
  line-height: 48px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  cursor: pointer !important;
  -webkit-tap-highlight-color: transparent;
}

#tab-unit .unit-gallery-arrow.prev { left: 12px !important; }
#tab-unit .unit-gallery-arrow.next { right: 12px !important; }
#tab-unit .unit-gallery-arrow:hover,
#tab-unit .unit-gallery-arrow:focus-visible { background: rgba(199,162,75,.96) !important; color: #07111b !important; }

#tab-unit .unit-gallery-strip {
  position: absolute !important;
  left: 50% !important;
  bottom: 14px !important;
  transform: translateX(-50%) !important;
  z-index: 13 !important;
  display: flex !important;
  gap: 8px !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 8px 10px !important;
  border-radius: 999px !important;
  background: rgba(7,17,27,.54) !important;
  backdrop-filter: blur(10px);
}

#tab-unit .unit-gallery-dot {
  width: 10px !important;
  height: 10px !important;
  border-radius: 50% !important;
  border: 1px solid rgba(255,255,255,.72) !important;
  background: rgba(255,255,255,.40) !important;
  padding: 0 !important;
}

#tab-unit .unit-gallery-dot.active {
  width: 26px !important;
  border-radius: 999px !important;
  background: #ead9a1 !important;
  border-color: #ead9a1 !important;
}

#tab-unit .unit-gallery-dot.video::after {
  content: '';
  display: block;
  width: 0;
  height: 0;
  margin: 2px 0 0 3px;
  border-top: 3px solid transparent;
  border-bottom: 3px solid transparent;
  border-left: 5px solid #07111b;
}

.ev-unit-gallery-lightbox {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483400 !important;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(3,8,13,.96) !important;
  color: #fff;
  direction: ltr;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
}

.ev-unit-gallery-lightbox.is-open { display: flex !important; }

.ev-unit-gallery-stage {
  position: relative;
  width: 100vw;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: max(18px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) max(18px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));
}

.ev-unit-gallery-stage img,
.ev-unit-gallery-stage video {
  width: 100% !important;
  height: 100% !important;
  max-width: 100vw !important;
  max-height: 100vh !important;
  object-fit: contain !important;
  object-position: center center !important;
  border-radius: 0 !important;
  background: #03080d !important;
}

.ev-unit-gallery-close,
.ev-unit-gallery-nav {
  position: fixed !important;
  z-index: 2147483402 !important;
  border: 1px solid rgba(234,217,161,.58) !important;
  background: rgba(7,17,27,.74) !important;
  color: #fff !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.35) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  -webkit-tap-highlight-color: transparent;
}

.ev-unit-gallery-close {
  top: max(16px, env(safe-area-inset-top)) !important;
  right: max(16px, env(safe-area-inset-right)) !important;
  width: 54px !important;
  height: 54px !important;
  border-radius: 999px !important;
  font-size: 36px !important;
  line-height: 1 !important;
  font-weight: 900 !important;
}

.ev-unit-gallery-nav {
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 68px !important;
  height: 76px !important;
  border-radius: 24px !important;
  font-size: 64px !important;
  line-height: 60px !important;
  font-weight: 900 !important;
  padding-bottom: 8px !important;
}

.ev-unit-gallery-nav.prev { left: max(10px, env(safe-area-inset-left)) !important; }
.ev-unit-gallery-nav.next { right: max(10px, env(safe-area-inset-right)) !important; }
.ev-unit-gallery-close:hover,
.ev-unit-gallery-nav:hover,
.ev-unit-gallery-close:focus-visible,
.ev-unit-gallery-nav:focus-visible { background: rgba(199,162,75,.96) !important; color: #07111b !important; }

.ev-unit-gallery-hint {
  position: fixed;
  left: 50%;
  bottom: max(16px, env(safe-area-inset-bottom));
  transform: translateX(-50%);
  z-index: 2147483402;
  max-width: calc(100vw - 28px);
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(7,17,27,.56);
  color: rgba(255,255,255,.86);
  font-size: 12px;
  font-weight: 800;
  text-align: center;
  backdrop-filter: blur(10px);
}

/* v2 fullscreen watermark and badges - keep Egypt Villas branding visible when image opens fullscreen */
.ev-unit-gallery-media-wrap {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.ev-unit-gallery-media-wrap::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(to bottom, rgba(0,0,0,.05), transparent 22%, transparent 72%, rgba(0,0,0,.18));
  z-index: 2;
}

.ev-unit-gallery-media-wrap img.ev-unit-gallery-image,
.ev-unit-gallery-media-wrap video.ev-unit-gallery-video {
  position: relative;
  z-index: 1;
}

.ev-unit-gallery-watermark {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 4;
  display: grid;
  place-items: center;
  gap: 6px;
  opacity: .52;
  pointer-events: none;
  text-align: center;
  filter: drop-shadow(0 8px 18px rgba(0,0,0,.45));
}

.ev-unit-gallery-watermark img {
  width: clamp(120px, 22vw, 270px) !important;
  height: auto !important;
  max-height: 140px !important;
  object-fit: contain !important;
  background: transparent !important;
}

.ev-unit-gallery-watermark span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(7,17,27,.52);
  border: 1px solid rgba(234,217,161,.45);
  color: #ead9a1;
  font-size: clamp(11px, 1.1vw, 15px);
  font-weight: 950;
  letter-spacing: .08em;
}

.ev-unit-gallery-brand-badge,
.ev-unit-gallery-code-badge {
  position: absolute;
  z-index: 5;
  bottom: max(18px, env(safe-area-inset-bottom));
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 8px 12px;
  border-radius: 12px;
  background: rgba(16,44,70,.88);
  border: 1px solid rgba(234,217,161,.38);
  color: #fff;
  font-size: 13px;
  font-weight: 950;
  letter-spacing: .05em;
  box-shadow: 0 10px 26px rgba(0,0,0,.28);
  pointer-events: none;
}

.ev-unit-gallery-brand-badge { left: max(14px, env(safe-area-inset-left)); }
.ev-unit-gallery-code-badge { right: max(14px, env(safe-area-inset-right)); }

@media (max-width: 760px) {
  .ev-unit-gallery-watermark { opacity: .58; }
  .ev-unit-gallery-watermark img { width: clamp(105px, 38vw, 190px) !important; }
  .ev-unit-gallery-brand-badge,
  .ev-unit-gallery-code-badge {
    bottom: max(14px, env(safe-area-inset-bottom));
    min-height: 30px;
    padding: 7px 10px;
    font-size: 11px;
    border-radius: 10px;
  }
}

body.ev-unit-gallery-open {
  overflow: hidden !important;
}

@media (max-width: 760px) {
  #tab-unit .unit-photo-main {
    aspect-ratio: 4 / 3 !important;
    min-height: 245px !important;
    max-height: 430px !important;
    border-radius: 20px !important;
  }

  #tab-unit .unit-gallery-arrow {
    width: 54px !important;
    height: 54px !important;
    font-size: 46px !important;
  }

  #tab-unit .unit-gallery-arrow.prev { left: 9px !important; }
  #tab-unit .unit-gallery-arrow.next { right: 9px !important; }

  .ev-unit-gallery-nav {
    width: 62px !important;
    height: 72px !important;
    font-size: 60px !important;
  }
}


/* v3: fullscreen still-image is drawn on canvas with baked Egypt Villas watermark. */
.ev-unit-gallery-canvas-wrap {
  background: #03080d !important;
}

.ev-unit-gallery-canvas {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100vw !important;
  max-height: 100vh !important;
  object-fit: contain !important;
  -webkit-user-select: none !important;
  user-select: none !important;
  -webkit-touch-callout: none !important;
  touch-action: pan-y pinch-zoom;
}

.ev-unit-gallery-loading {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  z-index: 3;
  padding: 9px 13px;
  border-radius: 999px;
  background: rgba(7,17,27,.72);
  color: #fff;
  font-weight: 900;
  font-size: 12px;
}

#tab-unit .unit-photo-main img,
#tab-unit .unit-photo-main video,
.ev-unit-gallery-lightbox img,
.ev-unit-gallery-lightbox video,
.ev-unit-gallery-lightbox canvas {
  -webkit-user-drag: none !important;
  -webkit-touch-callout: none !important;
}


/* v4: displayed gallery image uses server-generated watermarked path. */
.ev-unit-gallery-watermark-soft { opacity: .20 !important; }
#tab-unit #unitHeroImg[src*="ev-unit-gallery-watermark.php"] { background:#07111b !important; }


/* v7: download button exports the fullscreen canvas only, so downloaded photos include the baked watermark. */
.ev-unit-gallery-download {
  position: fixed !important;
  z-index: 2147483402 !important;
  top: max(16px, env(safe-area-inset-top)) !important;
  left: max(16px, env(safe-area-inset-left)) !important;
  min-width: 118px !important;
  height: 54px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(234,217,161,.58) !important;
  background: rgba(16,44,70,.86) !important;
  color: #fff !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.35) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 18px !important;
  font-size: 14px !important;
  font-weight: 950 !important;
  letter-spacing: .02em !important;
  cursor: pointer !important;
  -webkit-tap-highlight-color: transparent;
}

.ev-unit-gallery-download:hover,
.ev-unit-gallery-download:focus-visible {
  background: rgba(199,162,75,.96) !important;
  color: #07111b !important;
}

@media (max-width: 760px) {
  .ev-unit-gallery-download {
    height: 48px !important;
    min-width: 104px !important;
    padding: 0 14px !important;
    font-size: 12px !important;
  }
}
