/* 各功能页自己的布局 */

/* 留言中心: 会话列表 | 对话 | 客户信息 */
.inbox { display: grid; grid-template-columns: 320px 1fr 260px; gap: 16px; height: calc(100vh - 54px - 40px); }
.inbox > .card { display: flex; flex-direction: column; min-height: 0; }
.inbox__list { flex: 1; overflow: auto; }
.conv { padding: 10px 14px; border-bottom: 1px solid var(--line); cursor: pointer; }
.conv:hover { background: var(--surface-2); }
.conv--active { background: var(--primary-soft); }
.conv__top { display: flex; justify-content: space-between; gap: 8px; }
.conv__name { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.conv__msg { color: var(--muted); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: 2px; }
.conv__unread { background: var(--danger); color: #fff; border-radius: 9px; padding: 0 6px; font-size: 11px; }
.thread { flex: 1; overflow: auto; padding: 16px; display: flex; flex-direction: column; gap: 10px; background: var(--surface-2); }
.bubble { max-width: 72%; padding: 8px 12px; border-radius: 10px; background: var(--surface); border: 1px solid var(--line); white-space: pre-wrap; word-break: break-word; }
.bubble--out { align-self: flex-end; background: var(--primary-soft); border-color: transparent; }
.bubble__meta { font-size: 11px; color: var(--muted); margin-top: 4px; }
.composer { border-top: 1px solid var(--line); padding: 10px; display: flex; gap: 8px; align-items: flex-end; }
.composer textarea { flex: 1; min-height: 60px; }
.kv { display: grid; grid-template-columns: 70px 1fr; gap: 6px 8px; font-size: 12px; word-break: break-all; }
.kv dt { color: var(--muted); }
.kv dd { margin: 0; }

@media (max-width: 1200px) {
  .inbox { grid-template-columns: 280px 1fr; }
  .inbox__info { display: none !important; }
}
/* 必须写在 1200 那条之后, 否则被它覆盖 */
@media (max-width: 900px) {
  .inbox { grid-template-columns: 1fr; height: auto; }
  .inbox > .card { max-height: 70vh; }
}

/* 文件管理 */
.path { font-family: var(--mono); font-size: 12.5px; }
.path a { cursor: pointer; }
.editor { width: 100%; min-height: 60vh; }

/* diff */
.diff { font-family: var(--mono); font-size: 12px; background: var(--surface-2); border: 1px solid var(--line); border-radius: 6px; max-height: 60vh; overflow: auto; }
.diff div { padding: 0 8px; white-space: pre; }
.diff .add { background: #e6ffed; }
.diff .del { background: #ffeef0; }
.diff .gap { color: var(--muted); background: #f1f3f6; }

/* 登录页 */
.login { min-height: 100vh; display: grid; place-items: center; }
.login .card { width: 340px; }

/* 站点配置对比矩阵: 第一列(配置项)横向滚动时固定 */
.cfg th, .cfg td { white-space: nowrap; }
.cfg .cfg__key { position: sticky; left: 0; background: var(--surface); z-index: 1; }
.cfg thead .cfg__key { background: var(--surface-2); }
.cfg td.bad { background: var(--danger-soft); }
.cfg td.warn { background: var(--warn-soft); }
.cfg .ellipsis { max-width: 220px; }
.cfg__err { color: var(--danger); }
.cfg__warn { color: var(--warn); }

/* 内容中心: 正文预览 */
.preview { width: 100%; height: 320px; border: 1px solid var(--line); border-radius: 6px; margin-top: 8px; background: #fff; }