/* upload-thumb-actions.css — 全站上传缩略图操作按钮（裁剪 / 删除）统一黑金样式
 * 2026-09-26 v1。用户选定“新设计”：石墨玻璃底 + 香槟金裁剪框图标 + 浅红垃圾桶图标，
 * 悬停时裁剪变金色实心、删除变红色实心。
 * 覆盖范围：
 *   1) 照片页上传区 .uploader__icon-button--crop / --remove（桌面 + 手机 m107）
 *   2) 批量处理弹窗图片 .photo-batch-dialog__image-remove
 *   3) 创意生图参考图 .ref-image-item .remove-btn
 *   4) 意见反馈截图 .fb-upload-item .fb-upload-remove
 * 只改样式：JS 生成的结构、按钮文字（仍作为无障碍名称保留）和点击事件都不变。
 * 图标用 ::before 蒙版（-webkit-mask，Chromium 76 以上支持）。
 */

/* ===== 1. 照片页上传区（裁剪 + 删除） ===== */
html body.photo-ai3d-reference-page .c_main > .c_l .uploader__file-list__item.uploader__file-list__item .uploader__file-list__button.uploader__file-list__button {
  background: linear-gradient(180deg, rgba(10, 10, 9, .30) 0%, rgba(10, 10, 9, .66) 100%) !important;
  gap: 8px !important;
}
html body.photo-ai3d-reference-page .c_main > .c_l .uploader__file-list__item.uploader__file-list__item .uploader__file-list__button.uploader__file-list__button .uploader__icon-button.uploader__icon-button {
  width: 34px !important; min-width: 34px !important; height: 34px !important; min-height: 34px !important;
  padding: 0 !important; border-radius: 10px !important;
}
html body.photo-ai3d-reference-page .c_main > .c_l .uploader__file-list__item.uploader__file-list__item .uploader__file-list__button.uploader__file-list__button .uploader__icon-button.uploader__icon-button svg { display: none !important; }
html body.photo-ai3d-reference-page .c_main > .c_l .uploader__file-list__item.uploader__file-list__item .uploader__file-list__button.uploader__file-list__button .uploader__icon-button.uploader__icon-button::after { display: none !important; }

/* ===== 共用外观（照片页按钮 + 单个删除按钮） ===== */
html body.photo-ai3d-reference-page .c_main > .c_l .uploader__file-list__item.uploader__file-list__item .uploader__file-list__button.uploader__file-list__button .uploader__icon-button.uploader__icon-button,
html body .photo-batch-dialog__image-item .photo-batch-dialog__image-remove.photo-batch-dialog__image-remove,
html body .ref-image-item .remove-btn.remove-btn,
html body .fb-upload-item .fb-upload-remove.fb-upload-remove {
  border: 1px solid rgba(230, 206, 154, .46) !important;
  background: rgba(24, 23, 20, .84) !important;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, .40), inset 0 1px 0 rgba(255, 255, 255, .07) !important;
  color: #e6ce9a !important;
  cursor: pointer;
  transition: background-color .16s ease, border-color .16s ease, color .16s ease, transform .16s ease, box-shadow .16s ease !important;
}
html body.photo-ai3d-reference-page .c_main > .c_l .uploader__file-list__item.uploader__file-list__item .uploader__file-list__button.uploader__file-list__button .uploader__icon-button.uploader__icon-button::before,
html body .photo-batch-dialog__image-item .photo-batch-dialog__image-remove.photo-batch-dialog__image-remove::before,
html body .ref-image-item .remove-btn.remove-btn::before,
html body .fb-upload-item .fb-upload-remove.fb-upload-remove::before {
  content: "" !important; position: absolute !important;
  top: 50% !important; left: 50% !important; right: auto !important; bottom: auto !important;
  width: 16px !important; height: 16px !important; margin: -8px 0 0 -8px !important;
  border: 0 !important; border-radius: 0 !important; box-shadow: none !important; opacity: 1 !important;
  background: currentColor !important;
  -webkit-mask: center / contain no-repeat; mask: center / contain no-repeat;
}
html body.photo-ai3d-reference-page .c_main > .c_l .uploader__file-list__item.uploader__file-list__item .uploader__file-list__button.uploader__file-list__button .uploader__icon-button.uploader__icon-button.uploader__icon-button--crop::before { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2v14a2 2 0 0 0 2 2h14'/%3E%3Cpath d='M18 22V8a2 2 0 0 0-2-2H2'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2v14a2 2 0 0 0 2 2h14'/%3E%3Cpath d='M18 22V8a2 2 0 0 0-2-2H2'/%3E%3C/svg%3E"); }
html body.photo-ai3d-reference-page .c_main > .c_l .uploader__file-list__item.uploader__file-list__item .uploader__file-list__button.uploader__file-list__button .uploader__icon-button.uploader__icon-button.uploader__icon-button--remove::before,
html body .photo-batch-dialog__image-item .photo-batch-dialog__image-remove.photo-batch-dialog__image-remove::before,
html body .ref-image-item .remove-btn.remove-btn::before,
html body .fb-upload-item .fb-upload-remove.fb-upload-remove::before { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6'/%3E%3Cpath d='M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'/%3E%3Cpath d='M10 11v6'/%3E%3Cpath d='M14 11v6'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6'/%3E%3Cpath d='M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'/%3E%3Cpath d='M10 11v6'/%3E%3Cpath d='M14 11v6'/%3E%3C/svg%3E"); }

/* 删除：浅红描边 + 浅红图标 */
html body.photo-ai3d-reference-page .c_main > .c_l .uploader__file-list__item.uploader__file-list__item .uploader__file-list__button.uploader__file-list__button .uploader__icon-button.uploader__icon-button.uploader__icon-button--remove,
html body .photo-batch-dialog__image-item .photo-batch-dialog__image-remove.photo-batch-dialog__image-remove,
html body .ref-image-item .remove-btn.remove-btn,
html body .fb-upload-item .fb-upload-remove.fb-upload-remove {
  color: #f1b3ab !important; border-color: rgba(240, 120, 108, .46) !important;
}
/* 裁剪悬停：金色实心 */
html body.photo-ai3d-reference-page .c_main > .c_l .uploader__file-list__item.uploader__file-list__item .uploader__file-list__button.uploader__file-list__button .uploader__icon-button.uploader__icon-button.uploader__icon-button--crop:hover, html body.photo-ai3d-reference-page .c_main > .c_l .uploader__file-list__item.uploader__file-list__item .uploader__file-list__button.uploader__file-list__button .uploader__icon-button.uploader__icon-button.uploader__icon-button--crop:focus-visible {
  background: #dbc18c linear-gradient(135deg, #e6ce9a, #c6a36a) !important;
  border-color: #e1c792 !important; color: #28281c !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0, 0, 0, .42), 0 0 0 3px rgba(219, 193, 140, .18) !important;
}
/* 删除悬停：红色实心 */
html body.photo-ai3d-reference-page .c_main > .c_l .uploader__file-list__item.uploader__file-list__item .uploader__file-list__button.uploader__file-list__button .uploader__icon-button.uploader__icon-button.uploader__icon-button--remove:hover,
html body .photo-batch-dialog__image-item .photo-batch-dialog__image-remove.photo-batch-dialog__image-remove:hover,
html body .ref-image-item .remove-btn.remove-btn:hover,
html body .fb-upload-item .fb-upload-remove.fb-upload-remove:hover,
html body.photo-ai3d-reference-page .c_main > .c_l .uploader__file-list__item.uploader__file-list__item .uploader__file-list__button.uploader__file-list__button .uploader__icon-button.uploader__icon-button.uploader__icon-button--remove:focus-visible,
html body .photo-batch-dialog__image-item .photo-batch-dialog__image-remove.photo-batch-dialog__image-remove:focus-visible,
html body .ref-image-item .remove-btn.remove-btn:focus-visible,
html body .fb-upload-item .fb-upload-remove.fb-upload-remove:focus-visible {
  background: #d8453b !important; border-color: #ef6d62 !important; color: #fff !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0, 0, 0, .42), 0 0 0 3px rgba(216, 69, 59, .20) !important;
}
html body.photo-ai3d-reference-page .c_main > .c_l .uploader__file-list__item.uploader__file-list__item .uploader__file-list__button.uploader__file-list__button .uploader__icon-button.uploader__icon-button:active,
html body .photo-batch-dialog__image-item .photo-batch-dialog__image-remove.photo-batch-dialog__image-remove:active,
html body .ref-image-item .remove-btn.remove-btn:active,
html body .fb-upload-item .fb-upload-remove.fb-upload-remove:active { transform: scale(.94) !important; }
html body.photo-ai3d-reference-page .c_main > .c_l .uploader__file-list__item.uploader__file-list__item .uploader__file-list__button.uploader__file-list__button .uploader__icon-button.uploader__icon-button:focus-visible,
html body .photo-batch-dialog__image-item .photo-batch-dialog__image-remove.photo-batch-dialog__image-remove:focus-visible,
html body .ref-image-item .remove-btn.remove-btn:focus-visible,
html body .fb-upload-item .fb-upload-remove.fb-upload-remove:focus-visible { outline: 2px solid rgba(230, 206, 154, .9) !important; outline-offset: 2px !important; }

/* ===== 2–4. 单个删除按钮：放在缩略图右上角内侧，隐藏原来的 × / “删除” 文字 ===== */
html body .photo-batch-dialog__image-item .photo-batch-dialog__image-remove.photo-batch-dialog__image-remove,
html body .ref-image-item .remove-btn.remove-btn,
html body .fb-upload-item .fb-upload-remove.fb-upload-remove {
  position: absolute !important;
  top: 6px !important; right: 6px !important; left: auto !important; bottom: auto !important;
  z-index: 5 !important;
  width: 28px !important; min-width: 28px !important; height: 28px !important; min-height: 28px !important;
  padding: 0 !important; margin: 0 !important;
  border-radius: 8px !important;
  font-size: 0 !important; line-height: 0 !important; text-indent: 0 !important;
  overflow: hidden !important;
  display: block !important;
}
html body .photo-batch-dialog__image-item .photo-batch-dialog__image-remove.photo-batch-dialog__image-remove::before,
html body .ref-image-item .remove-btn.remove-btn::before,
html body .fb-upload-item .fb-upload-remove.fb-upload-remove::before { width: 14px !important; height: 14px !important; margin: -7px 0 0 -7px !important; }
html body .photo-batch-dialog__image-item .photo-batch-dialog__image-remove.photo-batch-dialog__image-remove::after,
html body .ref-image-item .remove-btn.remove-btn::after,
html body .fb-upload-item .fb-upload-remove.fb-upload-remove::after { display: none !important; }
html body .photo-batch-dialog__image-item .photo-batch-dialog__image-remove.photo-batch-dialog__image-remove:disabled {
  cursor: not-allowed !important; opacity: .45 !important; transform: none !important;
  background: rgba(24, 23, 20, .84) !important; color: #f1b3ab !important; border-color: rgba(240, 120, 108, .46) !important; box-shadow: none !important;
}
/* 创意生图参考图只有 80×80，按钮再小一点 */
html body .ref-image-item .remove-btn.remove-btn { top: 5px !important; right: 5px !important; width: 24px !important; min-width: 24px !important; height: 24px !important; min-height: 24px !important; border-radius: 7px !important; }
html body .ref-image-item .remove-btn.remove-btn::before { width: 13px !important; height: 13px !important; margin: -6.5px 0 0 -6.5px !important; }

/* 批量弹窗缩略图只有约 62×56，按钮用 22px */
html body .photo-batch-dialog__image-item .photo-batch-dialog__image-remove.photo-batch-dialog__image-remove { top: 4px !important; right: 4px !important; width: 22px !important; min-width: 22px !important; height: 22px !important; min-height: 22px !important; border-radius: 6px !important; }
html body .photo-batch-dialog__image-item .photo-batch-dialog__image-remove.photo-batch-dialog__image-remove::before { width: 12px !important; height: 12px !important; margin: -6px 0 0 -6px !important; }

/* ===== 手机端照片页（m107）：尺寸沿用 30px，只统一配色和图标 ===== */
html.m107-root body.m107-active.m107-active.m107-active.m107-active.m107-active.m107-active.m107-active.m107-active .c_main .uploader__file-list__button .uploader__icon-button.uploader__icon-button {
  border: 1px solid rgba(230, 206, 154, .46) !important;
  background: rgba(24, 23, 20, .86) !important;
  color: #e6ce9a !important; border-radius: 9px !important;
}
html.m107-root body.m107-active.m107-active.m107-active.m107-active.m107-active.m107-active.m107-active.m107-active .c_main .uploader__file-list__button .uploader__icon-button.uploader__icon-button.uploader__icon-button--remove {
  color: #f1b3ab !important; border-color: rgba(240, 120, 108, .46) !important;
}
html.m107-root body.m107-active.m107-active.m107-active.m107-active.m107-active.m107-active.m107-active.m107-active .c_main .uploader__file-list__button .uploader__icon-button.uploader__icon-button.uploader__icon-button--crop:active { background: #dbc18c linear-gradient(135deg, #e6ce9a, #c6a36a) !important; color: #28281c !important; }
html.m107-root body.m107-active.m107-active.m107-active.m107-active.m107-active.m107-active.m107-active.m107-active .c_main .uploader__file-list__button .uploader__icon-button.uploader__icon-button.uploader__icon-button--remove:active { background: #d8453b !important; color: #fff !important; }
html.m107-root body.m107-active.m107-active.m107-active.m107-active.m107-active.m107-active.m107-active.m107-active .c_main .uploader__file-list__button .uploader__icon-button.uploader__icon-button::before { width: 15px !important; height: 15px !important; margin: -7.5px 0 0 -7.5px !important; }
/* 手机缩略图约 78px 宽，但遮罩层被 _uploader.part-01.css 的 min-width: 92px !important 撑宽，删除按钮被裁掉。
 * 这里把遮罩层限制为缩略图宽度，去掉内边距、间距 6px，两个 30px 按钮就能完整显示 */
html.m107-root body.m107-active.m107-active.m107-active.m107-active.m107-active.m107-active.m107-active.m107-active .c_main .uploader__file-list__button.uploader__file-list__button {
  padding: 0 !important; gap: 6px !important; justify-content: center !important; align-items: center !important;
  min-width: 0 !important; width: 100% !important; left: 0 !important; right: 0 !important; box-sizing: border-box !important;
}
