/* Hamrah 4.12.8 Beta — Group 11.9B Dev1 R1 viewer/share stabilization */

/* Chat media: remove browser button chrome and reserve a bounded frame before decode. */
.attachment-image-button.g119b-media-frame,
button.attachment-image-button{
  appearance:none;-webkit-appearance:none;border:0;padding:0;margin:0 0 6px;background:#07111c;color:inherit;font:inherit;
  display:block;position:relative;overflow:hidden;cursor:pointer;line-height:0;text-align:initial;
  width:min(var(--g119b-media-width,270px),72vw);height:auto;aspect-ratio:var(--g119b-media-aspect,4/3);
  min-width:96px;max-width:min(270px,72vw);max-height:370px;border-radius:13px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.07);contain:layout paint;
}
.attachment-image-button.g119b-media-frame::before,
button.attachment-image-button::before{
  content:"";position:absolute;inset:0;background:linear-gradient(110deg,rgba(255,255,255,.035),rgba(255,255,255,.09),rgba(255,255,255,.035));
  background-size:220% 100%;animation:g119bMediaPulse 1.35s linear infinite;pointer-events:none;
}
.attachment-image-button[data-g119b-media-ready="true"]::before{display:none}
.attachment-image-button[data-g119b-media-error="true"]::after{
  content:"نمایش تصویر ممکن نشد";position:absolute;inset:0;display:grid;place-items:center;padding:12px;line-height:1.6;text-align:center;
  color:#d5e3ed;background:#0a1825;font-size:12px;font-weight:700;
}
.attachment-image-button .attachment-image{
  display:block!important;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;margin:0!important;
  border-radius:inherit!important;object-fit:contain!important;object-position:center!important;background:#03080d;transform:none!important;
}
@keyframes g119bMediaPulse{from{background-position:120% 0}to{background-position:-120% 0}}

/* Share geometry has one owner: the transform layer. The video never competes with it. */
.g119a-share-video-wrap.g119b-share-gesture-surface{position:relative;display:grid;place-items:center;overflow:hidden;isolation:isolate;touch-action:pan-x pan-y}
.g119a-layer[data-share="active"]:not([data-local-presenter="true"]) .g119a-share-video-wrap.g119b-share-gesture-surface{touch-action:none}
.g119b-share-transform{position:absolute;left:50%;top:50%;z-index:2;display:block;overflow:hidden;background:#000;translate:-50% -50%;will-change:transform,width,height;contain:layout paint}
.g119b-share-transform>.g119a-share-video{
  display:block!important;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;
  object-fit:fill!important;object-position:center!important;transform:none!important;transform-origin:center!important;transition:none!important;background:#000;
}
.g119a-share-empty,.g119a-share-overlay,.g119a-local-presenter{z-index:4}
.g119a-share-header{position:relative;z-index:8}

/* Fit/fill controls reflect renderer state, not cosmetic-only state. */
.g119b-viewer-controls{display:flex;direction:ltr;align-items:center;gap:5px}
.g119b-viewer-controls button{min-width:48px;min-height:44px;touch-action:manipulation}
.g119b-viewer-controls button.active,.g119b-viewer-controls button[aria-pressed="true"]{background:#168fd0;border-color:#54b8ef;color:#fff}

/* The call control strip remains its own horizontally-scrollable hit-testing plane while sharing. */
.g119a-layer[data-share="active"] .g119a-controls{
  z-index:30!important;overflow-x:auto!important;overflow-y:hidden!important;justify-content:flex-start!important;
  touch-action:pan-x!important;overscroll-behavior-inline:contain;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;
  scrollbar-width:none;isolation:isolate;
}
.g119a-layer[data-share="active"] .g119a-controls::-webkit-scrollbar{display:none}
.g119a-layer[data-share="active"] .g119a-control{scroll-snap-align:start;touch-action:manipulation}
.g119a-layer[data-share="active"] .g119a-controls::before,.g119a-layer[data-share="active"] .g119a-controls::after{content:"";flex:0 0 1px}

/* Focus/fullscreen: viewport owns dimensions; stale inline geometry cannot leak back. */
.g119a-layer[data-focus="true"] .g119a-share-video-wrap{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;padding:0!important;background:#000}
.g119a-layer[data-focus="true"] .g119a-share-main:fullscreen,
.g119a-layer[data-focus="true"] .g119a-share-main:-webkit-full-screen{width:100vw;height:100dvh;background:#000}
.g119a-layer[data-focus="true"] .g119a-share-header{z-index:40}
.g119a-layer[data-focus="true"] .g119a-controls{z-index:41!important}

/* Image viewer: independent transform state; never mutates chat thumbnails. */
body.g119b-image-viewer-open{overflow:hidden!important}
.g119b-image-viewer{position:fixed;inset:0;z-index:3000;display:grid!important;grid-template-rows:auto minmax(0,1fr);background:rgba(0,0,0,.96);padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));touch-action:none;overflow:hidden}
.g119b-image-viewer.hidden{display:none!important}
.g119b-image-viewer .viewer-toolbar{position:relative;z-index:4;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px;direction:rtl}
.g119b-image-viewer .viewer-toolbar span{display:flex;gap:6px;direction:ltr}
.g119b-image-viewer .viewer-toolbar button{min-width:46px;min-height:46px;border:1px solid rgba(255,255,255,.16);border-radius:14px;background:rgba(255,255,255,.1);color:#fff;font:inherit;font-weight:800}
.g119b-image-surface{min-height:0;display:grid;place-items:center;overflow:hidden;touch-action:none}
.g119b-image-surface #viewerImage{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;transform-origin:center;will-change:transform;transition:none!important;user-select:none;-webkit-user-drag:none}

@media(max-width:820px){
  .g119a-layer[data-share="active"] .g119a-controls{padding-inline:7px!important}
  .g119b-viewer-controls button{min-width:44px;min-height:44px;padding-inline:7px;font-size:11px}
  .g119a-layer[data-share="active"] .g119a-share-main{max-width:100%;min-width:0}
}
@media(prefers-reduced-motion:reduce){.attachment-image-button::before{animation:none}}
