/* ============================================================================
 * anim-tools-canvas-ref-assets.css · 画布 2.0 工单 G · 参考素材区
 * ----------------------------------------------------------------------------
 * 只服务 reports/js/canvas-ref-assets.js（⚙ 参数面板里的参考图 / 参考视频上传格）。
 * 为什么不塞进 anim-tools-canvas-promptbar.css：那份已经 411 行，再往里堆只会更难拆。
 * 版式沿用参数面板既有的 canvas-panel-row / canvas-seg 一套 token，不另起一套视觉。
 * ========================================================================== */

.canvas-refassets .canvas-refasset + .canvas-refasset {
  margin-top: var(--canvas-space-3);
}

.canvas-refasset {
  padding: var(--canvas-space-2);
  border: 1px solid var(--canvas-border-default);
  border-radius: var(--canvas-radius-md);
  background: var(--canvas-bg-canvas);
}

.canvas-refasset-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--canvas-space-2);
  font-size: var(--canvas-text-xs);
}

.canvas-refasset-name {
  color: var(--canvas-color-text);
}

.canvas-refasset-state {
  overflow: hidden;
  max-width: 60%;
  color: var(--canvas-fg-muted);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.canvas-refasset-state.is-ok {
  color: var(--canvas-fg-brand);
}

.canvas-refasset-body {
  display: flex;
  align-items: center;
  gap: var(--canvas-space-2);
  margin-top: var(--canvas-space-2);
}

.canvas-refasset-thumb {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  border-radius: var(--canvas-radius-sm);
  object-fit: cover;
}

.canvas-refasset-btn {
  flex: 1 1 auto;
  padding: 6px 8px;
  border: 1px solid var(--canvas-border-default);
  border-radius: var(--canvas-radius-sm);
  background: var(--canvas-bg-card);
  color: var(--canvas-fg-subtle);
  font-family: inherit;
  font-size: var(--canvas-text-xs);
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}

.canvas-refasset-btn:hover:not(:disabled) {
  background: var(--canvas-bg-glass-hover);
  color: var(--canvas-fg-brand);
}

.canvas-refasset-btn:disabled {
  cursor: default;
  opacity: 0.6;
}

/* 真正的 file input 藏起来，点的是上面那个按钮（display:none 的 input 仍可 .click()） */
.canvas-refasset-file {
  display: none;
}

.canvas-refasset-hint {
  margin-top: var(--canvas-space-1);
  color: var(--canvas-fg-muted);
  font-size: var(--canvas-text-xs);
  line-height: 1.5;
}