/*
 * 共享大图灯箱样式册（lightbox.css，lb- 前缀）
 *
 * 归属：common 共享组件 ImageLightbox（static/modules/common/image_lightbox.js）
 *       的唯一样式落点——全站图片大图查看单源，替代 stamp.js / company detail /
 *       placeholder_widget 三处存量重复灯箱的样式（存量迁移另批）。
 * 由 index_v2.html <link> 引入；?v= 由 static_version.py 出口统一注入。
 * 风格对齐 AGENTS.md：蒙层 rgba(36,41,47,0.75)、圆角≤6px、线性 SVG、
 * 无阴影堆砌（仅图片一层轻投影）、禁 emoji。
 */

/* ===== 蒙层：全屏，flex 居中主图；lb-open 控制显隐（默认 display:none） ===== */
.lb-mask {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 10001; /* 高于全站既有最高层 10000（assistant 域），保证压顶 */
  background: rgba(36, 41, 47, 0.75);
  align-items: center;
  justify-content: center;
  cursor: zoom-out;
}
.lb-mask.lb-open {
  display: flex;
}

/* ===== 打开期间 body 滚动锁定（JS 只挂类，不加 style） ===== */
body.lb-lock {
  overflow: hidden !important;
}

/* ===== 主图：contain 居中，最大 90vw/90vh；仅一层轻投影 ===== */
.lb-img {
  display: block;
  max-width: 90vw;
  max-height: 90vh;
  width: auto;
  height: auto;
  border-radius: 6px;
  box-shadow: 0 4px 16px rgba(36, 41, 47, 0.35);
  cursor: default;
  user-select: none;
}
/* 失败态：主图隐藏（avoid 破图图标），占位浮现 */
.lb-mask.lb-failed .lb-img {
  display: none;
}

/* ===== 顶部标题条：文件名，左上角，弱对比不抢主体 ===== */
.lb-title {
  position: absolute;
  top: 16px;
  left: 16px;
  right: 64px; /* 给右上角关闭按钮留位，长文件名截断不与按钮重叠 */
  max-width: calc(100vw - 80px);
  padding: 6px 12px;
  border-radius: 6px;
  background: rgba(36, 41, 47, 0.6);
  color: #ffffff;
  font-size: 13px;
  line-height: 1.5;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  pointer-events: none;
}
.lb-title.lb-title-empty {
  display: none;
}

/* ===== 失败占位：弱色文案 + 线性 SVG 图标，默认隐藏 ===== */
.lb-fail {
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 32px 40px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 6px;
  background: rgba(36, 41, 47, 0.6);
  color: #8c959f;
  font-size: 13px;
  cursor: default;
}
.lb-fail svg {
  width: 28px;
  height: 28px;
}
.lb-mask.lb-failed .lb-fail {
  display: flex;
}

/* ===== 右上角关闭按钮：白底深色系，圆角 6px ===== */
.lb-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 1px solid #d0d7de;
  border-radius: 6px;
  background: #ffffff;
  color: #24292f;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-family: inherit;
  line-height: 1;
}
.lb-close svg {
  width: 16px;
  height: 16px;
  display: block;
}
.lb-close:hover {
  background: #f6f8fa;
  border-color: #8c959f;
}
.lb-close:focus-visible {
  outline: 2px solid #0969da;
  outline-offset: 1px;
}
