/* =========================
   AI Image Viewer (Lightbox)
   ========================= */

.ai-image-viewer {
  position: fixed;
  inset: 0;
  /* 查看器那一档(同 .pdf-viewer-overlay):灯箱是全屏接管,必须压过点开它的面板/sheet。
     9999 那会儿只从聊天里开,没模态可争;品牌面板从 sheet 里开它,就露了馅(owner 2026-09-03)。 */
  z-index: var(--z-viewer);
  display: none;  /* ✅ 默认隐藏，由 JS 控制显示 */
}

/* ✅ 打开状态：JS 移除 hidden 属性时显示 */
.ai-image-viewer:not([hidden]) {
  display: block;
}

.ai-image-viewer[hidden] {
  display: none !important;
}

/* Backdrop */
.ai-image-viewer .viewer-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.66);
}

/* Stage */
.ai-image-viewer .viewer-stage {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px;
}

/* The image */
.ai-image-viewer .viewer-image {
  max-width: min(92vw, 1200px);
  max-height: 92vh;
  width: auto;
  height: auto;
  object-fit: contain;

  background: #fff;
  border-radius: 0;

  /* subtle border without "wobble" */
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.18) inset, 0 10px 40px rgba(0, 0, 0, 0.35);

  /* iOS render stability */
  transform: translateZ(0);
  -webkit-transform: translateZ(0);

  /* 移动端：完全禁用浏览器默认手势（含 iOS 边缘 swipe-back / 长按选中），让 JS 接管 */
  touch-action: none;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
}

/* viewer-stage 也禁用浏览器手势，防止用户在图片外的 stage 区域滑动被浏览器吃掉 */
.ai-image-viewer .viewer-stage {
  touch-action: none;
}

/* Buttons */
.ai-image-viewer .viewer-close,
.ai-image-viewer .viewer-prev,
.ai-image-viewer .viewer-next {
  position: absolute;
  border: none;
  /* 实色背景，视觉等同原半透明在 backdrop 上叠加后的色调 */
  background: #3a3a3a;
  color: #fff;
  cursor: pointer;
  border-radius: 999px;
  corner-shape: round;
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  /* viewer-image 有 transform 创建了 stacking context，按钮要 z-index 高于它才能浮在图片之上 */
  z-index: 2;

  /* stop iOS tap highlight */
  -webkit-tap-highlight-color: transparent;
}

.ai-image-viewer .viewer-close {
  top: 18px;
  right: 18px;
  font-size: 26px;
  line-height: 1;
}

/* X 图标居中由父级 flex 控制 */
.ai-image-viewer .viewer-close .viewer-close-icon{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

/* 来源按钮（搜参考图灯箱左上角：打开图片来源页；生成图/上传图无来源时隐藏）。复用 close/prev/next 的 #3a3a3a 胶囊基准 */
.ai-image-viewer .viewer-source {
  position: absolute;
  top: 18px;
  left: 18px;
  border: none;
  background: #3a3a3a;
  color: #fff;
  cursor: pointer;
  border-radius: 999px;
  corner-shape: round;
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}
.ai-image-viewer .viewer-source[hidden] { display: none !important; }
.ai-image-viewer .viewer-source svg { width: var(--icon-size); height: var(--icon-size); }
html:not([data-input="touch"]) .ai-image-viewer .viewer-source:hover{ background: #4a4a4a; }

.ai-image-viewer .viewer-source:active { background: #4a4a4a; }
.ai-image-viewer .viewer-source:focus-visible { outline: 2px solid rgba(255,255,255,0.9); outline-offset: 2px; }


.ai-image-viewer .viewer-prev {
  left: 18px;
  top: 50%;
  transform: translateY(-50%);
}
.ai-image-viewer .viewer-next {
  right: 18px;
  top: 50%;
  transform: translateY(-50%);
}

/* Hide nav when not available */
.ai-image-viewer.is-single .viewer-prev,
.ai-image-viewer.is-single .viewer-next {
  display: none !important;
}
/* 边界：第一张无 prev，最后一张无 next（不循环） */
.ai-image-viewer.is-first .viewer-prev {
  display: none !important;
}
.ai-image-viewer.is-last .viewer-next {
  display: none !important;
}

/* Focus visibility for keyboard users */
.ai-image-viewer .viewer-close:focus-visible,
.ai-image-viewer .viewer-prev:focus-visible,
.ai-image-viewer .viewer-next:focus-visible {
  outline: 2px solid rgba(255,255,255,0.9);
  outline-offset: 2px;
}


/* Mobile tweaks */
@media (max-width: 768px) {
  .ai-image-viewer .viewer-stage {
    padding: 12px;
    border-radius: 0;
  }

  .ai-image-viewer .viewer-image {
    max-width: 94vw;
    max-height: 90vh;
  }

  /* 手机端隐藏左右箭头，靠手指滑动切图 */
  .ai-image-viewer .viewer-prev,
  .ai-image-viewer .viewer-next {
    display: none;
  }
}