/* FileWork 通用预览悬浮操作栏：分享页 .preview-area 与主站预览弹窗 .preview-content 共用。
   宿主容器挂载后自动加 .fw-rail-host：隐藏查看器自带工具栏并让舞台铺满。
   颜色走 CSS 变量（主站 :root 提供），分享页无变量时回退 FW 设计令牌 hex；
   分享页深色覆盖规则在 dark-palette.css 的 .fw-share-page 前缀下。 */
.fw-rail-host { position: relative; }
.fw-preview-rail {
  position: absolute;
  left: 12px; top: 50%; right: auto; bottom: auto;
  transform: translateY(calc(-50% - 16px));
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  width: auto; height: auto;
  padding: 5px; gap: 3px;
  background: var(--background-white, #FFFFFA);
  border: 1px solid var(--border-light, #E4E1D9);
  border-radius: 12px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, .14);
  overflow: visible;
  z-index: 20; /* 必须高于 office 预览加载遮罩(10)，office 加载期间悬浮栏保持可见 */
  -webkit-tap-highlight-color: transparent;
}
.fw-preview-rail-btn {
  width: 30px; height: 30px;
  flex: none;
  padding: 0;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--text-primary, #171717);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.fw-preview-rail-btn svg {
  width: 16px; height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.fw-preview-rail-level {
  min-width: 30px;
  text-align: center;
  color: var(--text-secondary, #5D5B56);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}
.fw-preview-rail-btn:disabled { opacity: .35; cursor: default; }

/* 切换预览到新文件时的极简淡入（loadFile/openPreview 重启类名；reduced-motion 免动画） */
/* 不用 fill-mode：动画结束回到自然 opacity，避免 forwards 钉死 1 覆盖 autoHide 的 .18 */
.fw-fade-in { animation: fw-fade-in 300ms ease; }
@keyframes fw-fade-in { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .fw-fade-in { animation: none; }
}

/* 自动半透明防遮挡（autoHide）：交互时淡出，静默后恢复；淡出态仍可点击 */
.fw-preview-rail-autohide { transition: opacity var(--rail-hide-dur, 450ms) ease; }
.fw-preview-rail-autohide.is-dim { opacity: .18; }
@media (prefers-reduced-motion: reduce) {
  .fw-preview-rail-autohide { transition: none; }
}

/* 导航分组（保留 preview-media-navigation 类名：keyboard.js 据此定位方向键目标） */
.fw-preview-rail-nav {
  margin: 2px 0 0;
  padding-top: 6px;
  border-top: 1px solid var(--border-light, #E4E1D9);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
/* 扩展分组（分享页评论入口等）：与导航分组同样式，由调用方管理显隐 */
.fw-preview-rail-group {
  margin: 2px 0 0;
  padding-top: 6px;
  border-top: 1px solid var(--border-light, #E4E1D9);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.fw-preview-rail-group[hidden] { display: none !important; }

/* 宿主内查看器自带工具栏由悬浮栏取代：隐藏并让舞台铺满 */
.fw-rail-host .fw-image-viewer .fw-image-viewer-toolbar,
.fw-rail-host .fw-image-viewer-toolbar,
.fw-rail-host .viewer-toolbar,
.fw-rail-host .fw-document-toolbar { display: none; }
.fw-rail-host .fw-image-viewer .fw-image-viewer-stage,
.fw-rail-host .fw-image-viewer-stage,
.fw-rail-host .viewer-stage {
  position: absolute;
  top: 0; bottom: 0; left: 0; right: 0;
}
.fw-rail-host .fw-document-shell > :not(.fw-document-toolbar) { flex: 1 1 0; }

/* 悬停效果仅限精确指针，触屏点按不触发悬停闪变 */
@media (hover:hover) and (pointer:fine) {
  .fw-preview-rail-btn:not(:disabled):hover { background: var(--accent-soft, rgba(17, 17, 17, .06)); }
}

@media (max-width: 768px) {
  .fw-preview-rail { left: 6px; padding: 3px; gap: 3px; }
  .fw-preview-rail-btn { width: 36px; height: 36px; } /* 收窄以减少遮挡；低于 40px 触控推荐值，真机验证可接受 */
  .fw-preview-rail-level { min-width: 36px; }
}
