/* 右下角留言窗, 所有模板共用。模板用 --chat-accent 换主色 */
:root { --chat-accent: #2563eb; --chat-line: #e5e7eb; --chat-muted: #6b7280; }
.chat-fab { position: fixed; right: 20px; bottom: 20px; border: 0; background: var(--chat-accent); color: #fff; padding: 12px 18px; border-radius: 24px; font: inherit; cursor: pointer; box-shadow: 0 6px 20px rgba(0, 0, 0, .25); }
/* hidden 属性要压过下面的 display:flex, 否则留言窗在每个页面都是展开的 */
.chat[hidden] { display: none; }
.chat { position: fixed; right: 20px; bottom: 20px; width: min(360px, calc(100vw - 40px)); height: min(520px, calc(100vh - 40px)); background: #fff; border-radius: 12px; box-shadow: 0 12px 40px rgba(0, 0, 0, .2); display: flex; flex-direction: column; overflow: hidden; }
.chat__head { background: var(--chat-accent); color: #fff; padding: 12px 14px; font-weight: 600; display: flex; justify-content: space-between; align-items: center; }
.chat__close { border: 0; background: none; color: #fff; font-size: 22px; line-height: 1; cursor: pointer; }
.chat__thread { flex: 1; overflow: auto; padding: 12px; display: flex; flex-direction: column; gap: 8px; background: #f7f8fa; font-size: 14px; }
.chat__msg { max-width: 80%; padding: 7px 11px; border-radius: 10px; background: #fff; border: 1px solid var(--chat-line); white-space: pre-wrap; word-break: break-word; align-self: flex-end; }
.chat__msg--out { align-self: flex-start; background: #e8f0fe; border-color: transparent; }
.chat__hint { color: var(--chat-muted); font-size: 13px; text-align: center; }
.chat__form { border-top: 1px solid var(--chat-line); padding: 10px; display: grid; gap: 6px; }
.chat__who { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.chat__form input, .chat__form textarea { width: 100%; border: 1px solid var(--chat-line); border-radius: 6px; padding: 7px 9px; font: inherit; font-size: 14px; }
.chat__form textarea { height: 64px; resize: none; }
.chat__form button { border: 0; background: var(--chat-accent); color: #fff; border-radius: 6px; padding: 8px; font: inherit; cursor: pointer; }
.chat__form button:disabled { opacity: .6; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; }
