/* ============================================================
   fz-pick.css：图片选择/已有图片缩略图统一样式
   使用方：fill.php、group.php（前台填报）+ admin_layout.php（后台弹窗）
   配合 assets/js/fz-pick.js 使用；此前散落在 fill.php 内联 / fill.css，现统一于此
   ============================================================ */
/* ===== 已上传图片缩略图：点击放大原图 ===== */
.exist-imgs label img{cursor:zoom-in;transition:box-shadow .15s}
.exist-imgs label img:hover{box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 25%,transparent)}
/* 已有图片：✕ 标记删除 / ✓ 恢复（checkbox 隐藏，点击 label 原生切换） */
.ex-img .ex-x{position:absolute;top:2px;right:2px;width:18px;height:18px;border-radius:50%;
  background:rgba(220,38,38,.92);color:#fff;font-size:11px;line-height:18px;text-align:center;font-style:normal;
  box-shadow:0 1px 3px rgba(0,0,0,.25)}
.ex-img .ex-x::after{content:'✕'}
.ex-img input:checked ~ .ex-x{background:rgba(43,182,115,.92)}
.ex-img input:checked ~ .ex-x::after{content:'✓'}
.ex-img:has(input:checked) img{opacity:.35;filter:grayscale(.5)}
.ex-img:has(input:checked) img:hover{box-shadow:none}
/* 原图查看器（全屏遮罩 + 毛玻璃 + 淡入动画） */
.fz-viewer{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;
  background:rgba(8,12,24,.84);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  padding:28px;cursor:zoom-out;animation:fzvIn .18s ease}
.fz-viewer.show{display:flex}
.fz-viewer img{max-width:100%;max-height:100%;border-radius:10px;background:#fff;
  box-shadow:0 18px 60px rgba(0,0,0,.55);animation:fzvZoom .22s ease}
.fz-viewer .fzv-cap{position:absolute;left:0;right:0;bottom:18px;text-align:center;
  color:rgba(255,255,255,.85);font-size:12.5px;text-shadow:0 1px 4px rgba(0,0,0,.5);pointer-events:none}
.fz-viewer .fzv-x{position:absolute;top:18px;right:20px;width:40px;height:40px;border:0;border-radius:50%;
  background:rgba(255,255,255,.12);color:#fff;font-size:22px;line-height:38px;text-align:center;cursor:pointer;
  transition:background .15s,transform .15s;pointer-events:auto}
.fz-viewer .fzv-x:hover{background:rgba(255,255,255,.24);transform:rotate(90deg)}
@keyframes fzvIn{from{opacity:0}to{opacity:1}}
@keyframes fzvZoom{from{transform:scale(.92);opacity:0}to{transform:scale(1);opacity:1}}
/* ===== 新选图片预览：缩略图 / 删除 / 拖动排序（提交前） ===== */
.fz-pick{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.fz-pick:empty{display:none}
.fz-pick-it{position:relative;width:76px;height:76px;border:1.5px solid var(--border);border-radius:8px;
  background:var(--bg-2);cursor:grab;overflow:hidden;transition:border-color .15s,box-shadow .15s,opacity .15s}
.fz-pick-it:hover{border-color:var(--primary)}
.fz-pick-it img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.fz-pick-it .fz-pick-no{position:absolute;right:3px;bottom:2px;font-style:normal;font-size:11px;
  background:rgba(0,0,0,.55);color:#fff;border-radius:8px;padding:0 5px;line-height:15px}
.fz-pick-it .fz-pick-x{position:absolute;top:2px;right:2px;width:18px;height:18px;border-radius:50%;
  background:rgba(220,38,38,.9);color:#fff;font-size:11px;line-height:18px;text-align:center;cursor:pointer}
.fz-pick-it.drag{opacity:.4;border-style:dashed}
.fz-pick-it.over{border-color:var(--primary);box-shadow:0 0 0 2px color-mix(in srgb,var(--primary) 30%,transparent)}
.fz-pick-tip{font-size:11.5px;color:var(--muted);margin-top:4px}
