/* 客户窗口与客服端共享附件外形，颜色继承各自已确认的界面，不改变全局控件。 */
.chat-attachments-add{display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;height:44px;padding:10px;border:1px solid var(--line,#d8d3c9);border-radius:8px;background:transparent;color:inherit;cursor:pointer}
.chat-attachments-add svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.chat-attachments-add:focus-visible,.chat-attachments-remove:focus-visible,.chat-attachments-file:focus-visible{outline:2px solid var(--accent,#765336);outline-offset:2px}
.chat-attachments-add:disabled,.chat-attachments-remove:disabled{opacity:.45;cursor:not-allowed}
.chat-attachments-tray{display:flex;gap:8px;overflow-x:auto;max-width:100%;padding:8px 0}
.chat-attachments-draft{display:flex;align-items:center;gap:8px;flex:0 0 auto;max-width:min(280px,100%);min-width:0;padding:6px;border:1px solid var(--line,#d8d3c9);border-radius:8px;background:var(--surface,#fff)}
.chat-attachments-draft-image{width:42px;height:42px;object-fit:cover;border-radius:5px}
.chat-attachments-draft-info{min-width:0;display:grid;gap:2px;font-size:12px;line-height:1.4}
.chat-attachments-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px}
.chat-attachments-draft-info small{font-size:11px;color:var(--muted,#706a60)}
.chat-attachments-remove{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;padding:0;border:0;border-radius:6px;background:transparent;color:inherit;font-size:22px;cursor:pointer}
:where(.chat-attachments-drop-target){position:relative}
.chat-attachments-drop-hint{position:absolute;inset:6px;z-index:5;display:grid;place-items:center;padding:12px;border:2px dashed var(--accent,#765336);border-radius:10px;background:var(--surface,#fff);color:var(--ink,#302a23);pointer-events:none;font-size:14px;font-weight:600;text-align:center}
.chat-attachments-message{display:flex;flex-direction:column;align-items:flex-start;gap:8px;width:fit-content;max-width:100%;margin:6px 0}
.chat-attachments-file{display:block;max-width:100%;width:fit-content;overflow:hidden;border:1px solid var(--line,#d8d3c9);border-radius:9px;background:var(--surface,#fff);color:inherit;text-decoration:none}
.chat-attachments-image{display:block;max-width:100%;width:auto;height:auto;max-height:240px;object-fit:contain}
.chat-attachments-caption{display:block;max-width:260px;padding:8px 10px;overflow-wrap:anywhere;font-size:12px;line-height:1.5}
.chat-attachments-caption small{display:block;color:var(--muted,#706a60);font-size:11px}
/* 同批保持一个发送单位；逐张竖排、三点紧贴附件，操作范围和确认由两端菜单统一处理。 */
/* 扁图也给独立菜单留下完整触控高度，避免相邻附件的点击区重叠。 */
.chat-attachment-item{position:relative;width:fit-content;max-width:100%;min-height:44px}
.chat-attachment-more{position:absolute;right:-44px;top:0;display:grid;place-items:center;width:40px;height:44px;padding:0;border:0;border-radius:6px;background:transparent;color:var(--muted,#625c53);font:600 20px/1 Manrope,sans-serif;cursor:pointer}
.message.outgoing .chat-attachment-more,.chat-message-user .chat-attachment-more{right:auto;left:-44px}
.chat-attachment-more:hover{background:var(--wash,#eeeae3)}
.chat-attachment-more:focus-visible{outline:2px solid var(--accent,#765336);outline-offset:2px}
/* 查看器以现有深色文字色为底，不改宿主页配色；完整图片和放大后的滚动区域分别处理。 */
.chat-image-viewer{position:fixed;inset:0;z-index:10000;display:flex;flex-direction:column;min-width:0;background:var(--ink,#302a23);color:#fff;overscroll-behavior:contain}
.chat-image-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:12px max(12px,env(safe-area-inset-right)) 12px max(12px,env(safe-area-inset-left));border-bottom:1px solid #ffffff33}
.chat-image-count{margin-right:auto;font-size:14px;font-variant-numeric:tabular-nums}
.chat-image-control{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:8px 12px;border:1px solid #ffffff66;border-radius:8px;background:transparent;color:#fff;font:500 14px/1.4 sans-serif;text-decoration:none;cursor:pointer}
.chat-image-control:disabled{opacity:.4;cursor:default}.chat-image-control:focus-visible{outline:2px solid #fff;outline-offset:2px}
.chat-image-stage{display:flex;align-items:center;justify-content:center;flex:1;min-height:0;min-width:0;overflow:auto;overscroll-behavior:contain;padding:16px}
.chat-image-full{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;flex-shrink:0}
.chat-image-stage.is-zoomed{align-items:flex-start;justify-content:flex-start}.chat-image-stage.is-zoomed .chat-image-full{max-width:none;max-height:none}
.chat-image-error{max-width:320px;text-align:center;font-size:14px;line-height:1.6}
.chat-image-error[hidden],.chat-image-full[hidden]{display:none!important}
/* 引用只占缩略图需要的宽度，普通文件仍保留可识别名称；关闭入口由两端各自引用卡片提供。 */
.chat-attachments-compact{flex-direction:row;flex-wrap:wrap;gap:6px;margin:4px 0 0;max-width:240px}
.chat-attachments-compact .chat-attachments-image{width:56px;height:56px;object-fit:contain;background:var(--surface,#fff)}
.chat-attachments-compact .chat-attachments-caption{max-width:200px;padding:6px 8px}
.chat-quote-remove{display:grid;place-items:center;align-self:flex-start;flex:0 0 36px;width:36px;min-height:36px;padding:0;border:0;border-radius:6px;background:transparent;color:inherit;font-size:22px;line-height:1;cursor:pointer}
.chat-quote-remove:hover{background:var(--wash,#eeeae3)}
.chat-quote-remove:focus-visible{outline:2px solid var(--accent,#765336);outline-offset:1px}
@media(pointer:coarse){.chat-quote-remove{flex-basis:44px;width:44px;min-height:44px}}
.message.outgoing .chat-attachments-message,.chat-message-user .chat-attachments-message{margin-left:auto;align-items:flex-end}
/* 通用隐藏规则不能依赖宿主页，否则空托盘和拖拽提示会占据聊天区。 */
.chat-attachments-tray[hidden],.chat-attachments-drop-hint[hidden],.chat-attachments-picker[hidden],.chat-attachments-image[hidden],.chat-attachments-caption[hidden]{display:none!important}