/*
 * 睿裕通 · 智能在线咨询 —— 界面重构 v2.0
 * 2026-08-30 设计升级：品牌睿绿主色 / 现代化圆角 / 新增注册升级引导条
 * 说明：本文件仅做视觉层重构，所有 class 名与 data-* 结构保持与 online-consult.js 兼容，未改动任何交互逻辑。
 */
*{box-sizing:border-box;letter-spacing:0}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#f7f9fb;color:#16202e;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased}
button,input,textarea{font:inherit}
button{color:inherit}

:root{
 --pri:#0b8069;--pri2:#0e9c82;--soft:#e6f5f1;--line:#bfe4da;
 --gold:#c9a227;--gold2:#e8c95a;--goldsoft:#fdf6e3;--goldline:#f0e2b8;
 --ink:#16202e;--sub:#5b6675;--mute:#8a93a3;--edge:#eef1f5;
}

/* 布局：header / context / log / suggestions / upgrade / compose */
.online-consult{width:100%;height:100%;display:grid;grid-template-rows:auto auto minmax(140px,1fr) auto auto auto;overflow:hidden;background:#f7f9fb}

/* ---------- 顶栏 ---------- */
.consult-header{min-height:66px;display:flex;align-items:center;gap:11px;padding:11px 11px 11px 14px;background:linear-gradient(135deg,#0b8069,#0e9c82);border-bottom:0;position:relative}
.consult-header::after{content:"";position:absolute;right:-30px;top:-40px;width:120px;height:120px;border-radius:50%;background:rgba(255,255,255,.07);pointer-events:none}
.consult-logo{position:relative;width:36px;height:36px;display:grid;place-items:center;flex:0 0 auto;border-radius:11px;background:rgba(255,255,255,.22);border:1.5px solid rgba(255,255,255,.38);color:#fff;font-size:16px}
.consult-logo i{position:absolute;right:-3px;bottom:-3px;width:11px;height:11px;border:2px solid #0b8069;border-radius:50%;background:#3ecf8e}
.consult-heading{min-width:0;flex:1}.consult-heading h1{margin:0;font-size:15px;font-weight:800;color:#fff;letter-spacing:.5px}
.consult-heading p{margin:3px 0 0;color:rgba(255,255,255,.86);font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.consult-login{color:#fff;text-decoration:none;font-size:11.5px;white-space:nowrap;font-weight:700;padding:6px 13px;border-radius:99px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.32)}
.consult-login:hover{background:rgba(255,255,255,.28)}
.consult-close{width:32px;height:32px;padding:0;border:0;border-radius:9px;background:transparent;color:rgba(255,255,255,.85);font-size:23px;line-height:1;cursor:pointer;flex:0 0 auto}
.consult-close:hover{background:rgba(255,255,255,.18);color:#fff}

/* ---------- 场景提示 ---------- */
.consult-context{min-height:40px;display:flex;align-items:center;gap:8px;padding:7px 14px;border-bottom:1px solid var(--edge);background:#fbfefd;color:var(--pri);font-size:11.5px}
.consult-context strong{color:var(--ink)}

/* ---------- 对话流 ---------- */
.consult-log{min-height:0;overflow-y:auto;padding:14px;background:#f7f9fb;scroll-behavior:smooth}
.consult-log::-webkit-scrollbar{width:6px}
.consult-log::-webkit-scrollbar-thumb{background:#dde3e9;border-radius:99px}
.consult-log::-webkit-scrollbar-track{background:transparent}
.consult-message{display:flex;align-items:flex-start;gap:9px;margin:11px 0}
.consult-message.mine{justify-content:flex-end}
.message-avatar{width:30px;height:30px;display:grid;place-items:center;flex:0 0 auto;border-radius:10px;background:linear-gradient(135deg,#0b8069,#0e9c82);color:#fff;font-size:14px;font-weight:700}
.message-content{max-width:82%;min-width:0}
.consult-message.mine .message-content{display:flex;align-items:flex-end;flex-direction:column}
.message-content>strong{display:block;margin:0 0 5px;color:var(--mute);font-size:11px;font-weight:600}
.message-bubble{padding:10px 13px;border-radius:14px;background:#fff;border:1px solid var(--edge);box-shadow:0 1px 4px rgba(22,32,46,.05);font-size:13px;line-height:1.72;overflow-wrap:anywhere}
.consult-message.assistant .message-bubble{border-bottom-left-radius:5px}
.consult-message.mine .message-bubble{background:linear-gradient(135deg,#0b8069,#0e9c82);color:#fff;border-color:transparent;box-shadow:0 2px 8px rgba(11,128,105,.18);border-bottom-right-radius:5px}
.message-content time{display:block;margin-top:5px;color:#b3bbc6;font-size:10px}
.message-file,.message-image{display:flex;align-items:center;gap:8px;margin-top:8px;padding:8px;border:1px solid var(--edge);border-radius:10px;background:#fff;color:var(--ink);text-decoration:none}
.message-file>span{padding:3px 7px;border-radius:6px;background:var(--soft);color:var(--pri);font-size:10px;font-weight:800}
.message-file strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
.message-image{display:block}
.message-image img{display:block;width:100%;max-height:170px;object-fit:contain;border-radius:8px;background:#f7f9fb}
.message-image span{display:block;margin-top:6px;font-size:11px;color:var(--sub)}
.consult-message.mine .message-file,.consult-message.mine .message-image{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.3);color:#fff}
.consult-message.mine .message-file>span{background:rgba(255,255,255,.26);color:#fff}
.message-bubble audio{display:block;width:240px;max-width:100%;margin-top:8px}

/* ---------- 智能询价单 ---------- */
.consult-intelligence{margin:13px 0 4px 39px;overflow:hidden;border:1.5px solid var(--line);border-radius:13px;background:#fff;box-shadow:0 2px 10px rgba(11,128,105,.07)}
.consult-intelligence>header{min-height:46px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 12px;border-bottom:1px solid var(--line);background:linear-gradient(135deg,#f4fbf9,#e6f5f1)}
.consult-intelligence>header div span,.consult-intelligence>header div small{display:block}
.consult-intelligence>header div span{color:var(--pri);font-size:13px;font-weight:800}
.consult-intelligence>header div small{margin-top:2px;color:var(--sub);font-size:10px}
.consult-intelligence>header>b{color:var(--pri);font-size:11px;font-weight:800;white-space:nowrap}
.intelligence-fields{display:grid;grid-template-columns:76px minmax(0,1fr);gap:8px 10px;padding:11px 12px;font-size:12px}
.intelligence-fields span{color:var(--mute)}
.intelligence-fields strong{font-weight:700;overflow-wrap:anywhere;color:var(--ink)}
.intelligence-missing{padding:11px 12px;border-top:1px solid var(--goldline);background:var(--goldsoft)}
.intelligence-missing>div:first-child{display:flex;align-items:flex-start;gap:8px;color:#7a6318;font-size:12px}
.intelligence-missing b{flex:0 0 auto;color:#6b5310;font-weight:800}
.intelligence-inputs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:9px}
.intelligence-inputs input{min-width:0;height:38px;padding:0 10px;border:1.5px solid #ecdfc4;border-radius:10px;background:#fff;color:var(--ink);outline:none}
.intelligence-inputs input:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(201,162,39,.13)}
.intelligence-ready{padding:11px 12px;border-top:1px solid var(--line);background:#f4fbf9;color:var(--pri);font-size:12px}
.consult-intelligence>footer{display:flex;justify-content:flex-end;gap:8px;padding:10px 12px;border-top:1px solid var(--edge)}
.intelligence-secondary,.intelligence-primary{min-height:36px;padding:8px 14px;border-radius:10px;cursor:pointer;font-size:12px;font-weight:700}
.intelligence-secondary{border:1.5px solid var(--line);background:#fff;color:var(--pri)}
.intelligence-secondary:hover{background:var(--soft)}
.intelligence-primary{border:0;background:linear-gradient(135deg,#0b8069,#0e9c82);color:#fff;box-shadow:0 4px 12px rgba(11,128,105,.22)}
.intelligence-primary:hover{filter:brightness(1.05)}

/* ---------- 快捷建议 ---------- */
.consult-suggestions{display:flex;gap:7px;overflow-x:auto;padding:9px 12px;border-top:1px solid var(--edge);background:#fff;scrollbar-width:none}
.consult-suggestions::-webkit-scrollbar{display:none}
.consult-suggestions button{min-height:36px;flex:0 0 auto;padding:7px 14px;border:1.5px solid var(--edge);border-radius:99px;background:#f7f9fb;color:var(--sub);cursor:pointer;font-size:12px;font-weight:600}
.consult-suggestions button:hover{border-color:var(--line);background:var(--soft);color:var(--pri)}

/* ---------- 注册升级引导条（新增） ---------- */
.consult-upgrade{display:flex;align-items:center;gap:10px;padding:9px 12px;border-top:1px solid var(--goldline);background:var(--goldsoft)}
.consult-upgrade .upgrade-icon{width:26px;height:26px;border-radius:9px;flex:0 0 auto;display:grid;place-items:center;background:linear-gradient(135deg,#e8c95a,#c9a227);color:#3d2f06;font-size:13px;font-weight:800}
.consult-upgrade .upgrade-text{flex:1;min-width:0}
.consult-upgrade .upgrade-text b{display:block;color:#6b5310;font-size:11.5px;font-weight:800;line-height:1.5}
.consult-upgrade .upgrade-text span{display:block;color:#8a6d1f;font-size:10.5px;margin-top:2px;line-height:1.5}
.consult-upgrade .upgrade-btn{flex:0 0 auto;padding:7px 14px;border-radius:10px;background:linear-gradient(135deg,#e8c95a,#c9a227);color:#3d2f06;font-size:11.5px;font-weight:800;text-decoration:none;white-space:nowrap;box-shadow:0 3px 9px rgba(201,162,39,.26)}
.consult-upgrade .upgrade-btn:hover{filter:brightness(1.05)}

/* ---------- 输入区 ---------- */
.consult-compose{padding:9px 12px 11px;border-top:1px solid var(--edge);background:#fff}
.compose-tools{min-height:30px;display:flex;align-items:center;gap:3px}
.consult-tool{position:relative;min-height:30px;display:inline-flex;align-items:center;padding:5px 9px;border:0;border-radius:9px;background:transparent;color:var(--sub);cursor:pointer;font-size:12px;overflow:hidden}
.consult-tool:hover,.consult-tool.active{background:var(--soft);color:var(--pri)}
.consult-tool input{position:absolute;inset:0;opacity:0;cursor:pointer}
.compose-state{min-width:0;margin-left:auto;color:var(--pri);font-size:10.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.compose-state[data-tone=error]{color:#d94a3d}
.compose-state[data-tone=warn]{color:#c47b12}
.compose-file{min-height:32px;display:flex;align-items:center;gap:8px;margin:3px 0 7px;padding:7px 10px;border-radius:10px;background:#f7f9fb;color:var(--sub);font-size:11px}
.compose-file[hidden]{display:none}
.compose-file span{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.compose-file button{width:22px;height:22px;padding:0;border:0;border-radius:50%;background:#eef1f5;color:var(--mute);cursor:pointer;font-size:12px;line-height:1;flex:0 0 auto}
.compose-file button:hover{background:#e2e7ec;color:#d94a3d}
.compose-row{display:flex;align-items:flex-end;gap:8px}
.compose-row textarea{min-width:0;min-height:44px;max-height:96px;flex:1;resize:none;padding:11px 12px;border:1.5px solid #e8ecf1;border-radius:12px;background:#fbfcfd;color:var(--ink);outline:none;font-size:13px;line-height:1.65}
.compose-row textarea::placeholder{color:#b3bbc6}
.compose-row textarea:focus{border-color:var(--pri);background:#fff;box-shadow:0 0 0 3px rgba(11,128,105,.09)}
.consult-send{width:46px;height:44px;display:grid;place-items:center;flex:0 0 auto;padding:0;border:0;border-radius:12px;background:linear-gradient(135deg,#0b8069,#0e9c82);color:#fff;cursor:pointer;font-size:16px;box-shadow:0 4px 12px rgba(11,128,105,.26)}
.consult-send:hover{filter:brightness(1.06)}
.consult-send:disabled{opacity:.5;cursor:wait;box-shadow:none}
.consult-compose>p{margin:8px 0 0;color:#b3bbc6;text-align:center;font-size:10px}

/* ---------- 响应式 ---------- */
@media(max-width:460px){
 .consult-header{padding-left:12px}
 .consult-login{display:none}
 .consult-log{padding:12px 10px}
 .consult-intelligence{margin-left:34px}
 .intelligence-inputs{grid-template-columns:1fr}
 .consult-suggestions{padding-left:9px;padding-right:9px}
 .consult-upgrade{padding-left:9px;padding-right:9px}
 .consult-upgrade .upgrade-text span{display:none}
 .consult-compose{padding-left:9px;padding-right:9px}
 .compose-row textarea{font-size:16px}
 .consult-tool{padding-left:6px;padding-right:6px}
}
@media(max-width:350px){
 .consult-heading p{max-width:170px}
 .consult-intelligence{margin-left:0}
 .message-content{max-width:88%}
 .consult-tool{font-size:11px}
}
