/* Ruleset: SAPAI-GOV-002 v2.0 — canonical image lightbox and zoom cue. */
:root{
  --sapamefa-zoom-pointer-size:64px;
  --sapamefa-zoom-pointer-thickness:2px;
  --sapamefa-zoom-pointer-color:var(--smf-color-bright);
}

.sapamefa-zoom-pointer{
  position:fixed;
  left:0;
  top:0;
  z-index:calc(var(--smf-z-modal) + 2);
  width:var(--sapamefa-zoom-pointer-size);
  height:var(--sapamefa-zoom-pointer-size);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translate3d(-50%,-50%,0);
  transition:opacity var(--smf-motion-control) var(--smf-ease-standard),visibility var(--smf-motion-control) var(--smf-ease-standard);
  will-change:left,top,opacity;
}
.sapamefa-zoom-pointer.is-visible{opacity:1;visibility:visible;}
.sapamefa-zoom-pointer__segment{
  position:absolute;
  display:block;
  border-radius:var(--smf-radius-pill);
  background:var(--sapamefa-zoom-pointer-color);
  opacity:0;
  transition:transform var(--smf-motion-reveal) var(--smf-ease-emphasized),opacity var(--smf-motion-image) var(--smf-ease-standard);
  will-change:transform,opacity;
}
.sapamefa-zoom-pointer__segment.is-top,.sapamefa-zoom-pointer__segment.is-bottom{left:50%;width:var(--sapamefa-zoom-pointer-thickness);height:calc(var(--sapamefa-zoom-pointer-size)/2);}
.sapamefa-zoom-pointer__segment.is-left,.sapamefa-zoom-pointer__segment.is-right{top:50%;width:calc(var(--sapamefa-zoom-pointer-size)/2);height:var(--sapamefa-zoom-pointer-thickness);}
.sapamefa-zoom-pointer__segment.is-top{top:0;transform:translate(-50%,-48px);}
.sapamefa-zoom-pointer__segment.is-bottom{bottom:0;transform:translate(-50%,48px);}
.sapamefa-zoom-pointer__segment.is-left{left:0;transform:translate(-48px,-50%);}
.sapamefa-zoom-pointer__segment.is-right{right:0;transform:translate(48px,-50%);}
.sapamefa-zoom-pointer.is-assembled .sapamefa-zoom-pointer__segment{opacity:1;}
.sapamefa-zoom-pointer.is-assembled .sapamefa-zoom-pointer__segment.is-top,.sapamefa-zoom-pointer.is-assembled .sapamefa-zoom-pointer__segment.is-bottom{transform:translate(-50%,0);}
.sapamefa-zoom-pointer.is-assembled .sapamefa-zoom-pointer__segment.is-left,.sapamefa-zoom-pointer.is-assembled .sapamefa-zoom-pointer__segment.is-right{transform:translate(0,-50%);}
.sapamefa-zoom-pointer.is-zoom-out .sapamefa-zoom-pointer__segment.is-top,.sapamefa-zoom-pointer.is-zoom-out .sapamefa-zoom-pointer__segment.is-bottom{display:none;}
.sapamefa-zoom-pointer.is-zoom-out .sapamefa-zoom-pointer__segment.is-left,.sapamefa-zoom-pointer.is-zoom-out .sapamefa-zoom-pointer__segment.is-right{opacity:1;}

.sapamefa-media-lightbox{
  position:fixed;
  inset:0;
  z-index:var(--smf-z-modal);
  display:flex;
  align-items:center;
  justify-content:center;
  padding: var(--smf-space-6);
  background:var(--smf-color-overlay-strong);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity var(--smf-motion-image) var(--smf-ease-standard),visibility var(--smf-motion-image) var(--smf-ease-standard);
}
.sapamefa-media-lightbox.is-open{opacity:1;visibility:visible;pointer-events:auto;}
.sapamefa-media-lightbox__backdrop{position:absolute;inset:0;width:100%;height:100%;padding: 0;border:0;background:var(--smf-color-transparent);cursor:default;}
.sapamefa-media-lightbox__dialog{position:relative;z-index:1;display:flex;width:min(1120px,96vw);max-height:94vh;flex-direction:column;align-items:center;justify-content:center;transform:scale(.96);transition:transform var(--smf-motion-image) var(--smf-ease-emphasized);}
.sapamefa-media-lightbox.is-open .sapamefa-media-lightbox__dialog{transform:scale(1);}
.sapamefa-media-lightbox__stage{position:relative;display:flex;width:100%;height:min(78vh,820px);align-items:center;justify-content:center;padding-inline: var(--smf-space-16);}
.sapamefa-media-lightbox__image-button{display:flex;max-width:100%;max-height:100%;align-items:center;justify-content:center;padding: 0;border:0;background:var(--smf-color-transparent);}
.sapamefa-media-lightbox__image{display:block;max-width:100%;max-height:78vh;object-fit:contain;border-radius:var(--smf-radius-small);user-select:none;opacity:1;transform:translateX(0) scale(1);}
.sapamefa-media-lightbox__nav{position:absolute;top:50%;z-index:2;width:48px;height:48px;display:grid;place-items:center;padding: 0;border:var(--smf-border-width-hairline) solid var(--smf-color-brand-teal);border-radius:50%;background:var(--smf-color-brand-teal);color:var(--smf-color-white);cursor:pointer;transform:translateY(-50%);font:inherit;transition:background var(--smf-motion-control) var(--smf-ease-standard),border-color var(--smf-motion-control) var(--smf-ease-standard),transform var(--smf-motion-control) var(--smf-ease-standard);}
.sapamefa-media-lightbox__nav.is-prev{left:8px;}
.sapamefa-media-lightbox__nav.is-next{right:8px;}
.sapamefa-media-lightbox__nav[hidden]{display:none;}
.sapamefa-media-lightbox__nav:hover,.sapamefa-media-lightbox__nav:focus-visible{background:var(--smf-color-teal);border-color:var(--smf-color-teal);transform:translateY(-50%) scale(1.08);}
.sapamefa-media-lightbox__thumbnails{width:min(900px,90vw);display:flex;justify-content:center;gap: var(--smf-space-2);margin-top: var(--smf-space-3);padding: 6px;overflow-x:auto;scrollbar-width:thin;}
.sapamefa-media-lightbox__thumbnails[hidden]{display:none;}
.sapamefa-media-lightbox__thumbnails button{width:68px;height:52px;flex:0 0 auto;padding: 2px;border:var(--smf-border-width-strong) solid var(--smf-color-white-24);border-radius:var(--smf-radius-small);background:var(--smf-color-transparent);opacity:.46;cursor:pointer;transition:opacity var(--smf-motion-fast) var(--smf-ease-standard),border-color var(--smf-motion-fast) var(--smf-ease-standard),transform var(--smf-motion-fast) var(--smf-ease-standard);}
.sapamefa-media-lightbox__thumbnails button:hover,.sapamefa-media-lightbox__thumbnails button:focus-visible{opacity:.84;border-color:var(--smf-color-white-68);}
.sapamefa-media-lightbox__thumbnails button.is-active{border-color:var(--smf-color-bright);opacity:1;transform:scale(1.05);}
.sapamefa-media-lightbox__thumbnails img{width:100%;height:100%;object-fit:contain;border-radius:calc(var(--smf-radius-small) - 2px);background:var(--smf-color-surface);}
[data-sapamefa-lightbox-src]{border:0;background:var(--smf-color-transparent);}

@media (hover:hover) and (pointer:fine){
  .sapamefa-zoom-target,.sapamefa-media-lightbox__image-button{cursor:none!important;}
  .sapamefa-zoom-indicator i{display:none!important;}
}
@media (max-width:767px){
  .sapamefa-media-lightbox{padding: var(--smf-space-3);}
  .sapamefa-media-lightbox__dialog{width:100%;}
  .sapamefa-media-lightbox__stage{height:72vh;padding-inline: 46px;}
  .sapamefa-media-lightbox__image{max-height:72vh;}
  .sapamefa-media-lightbox__nav{width:42px;height:42px;}
  .sapamefa-media-lightbox__thumbnails{width:94vw;justify-content:flex-start;}
}
@media (prefers-reduced-motion:reduce){
  .sapamefa-zoom-pointer,.sapamefa-zoom-pointer__segment,.sapamefa-media-lightbox,.sapamefa-media-lightbox__dialog,.sapamefa-media-lightbox__image,.sapamefa-media-lightbox__nav,.sapamefa-media-lightbox__thumbnails button{transition:none!important;}
}

/* SAPAMEFA V10.7 — Lightbox transparent rounded-frame contract.
   Preserve the current image radius while making the frame explicitly real,
   transparent and free of any visible border or thick background. */
.sapamefa-media-lightbox__image-button {
  overflow: hidden;
  border: var(--smf-border-width-hairline) solid var(--smf-color-transparent);
  border-radius: var(--smf-radius-small);
  background: var(--smf-color-transparent);
  box-shadow: none;
}
.sapamefa-media-lightbox__image {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 78vh;
  border: 0;
  border-radius: var(--smf-radius-small);
  background: var(--smf-color-transparent);
  object-fit: contain;
  box-sizing: border-box;
  clip-path: inset(0 round var(--smf-radius-small));
}
@media (max-width: 767px) {
  .sapamefa-media-lightbox__image {
    max-height: 72vh;
  }
}
