/* ============================================================
   AI 商业咨询智能体 · 组件样式
   沿用东方留白令牌：宣纸米 / 墨黑 / 朱砂 / 墨线
   ============================================================ */

/* ---------- 首页：AI 商业咨询 板块布局 ---------- */
.ai-consult-grid{
  display:grid;grid-template-columns:.78fr 1.22fr;gap:56px;align-items:start;
}
.ai-consult-side{border-top:1px solid var(--color-text, #1A1814);padding-top:30px;}
.ai-consult-side > b{
  display:block;font-family:var(--font-serif, serif);font-size:19px;font-weight:700;
  letter-spacing:2px;margin-bottom:22px;color:var(--color-text, #1A1814);
}
.ai-consult-side ul{list-style:none;padding:0;margin:0 0 24px;}
.ai-consult-side li{
  position:relative;padding:11px 0 11px 22px;font-size:14.5px;line-height:1.75;
  color:var(--color-text-2, #4A463E);border-bottom:1px solid var(--color-border, #D6CFBE);
}
.ai-consult-side li::before{
  content:"";position:absolute;left:0;top:20px;width:6px;height:6px;
  background:var(--color-accent, #C8321E);display:block;
}
.ai-consult-note{
  display:block;font-size:13px;line-height:1.85;color:var(--color-muted, #6E6759);
  padding-left:14px;border-left:2px solid var(--color-accent, #C8321E);
}

@media (max-width:920px){
  .ai-consult-grid{grid-template-columns:1fr;gap:36px;}
}

.ai-panel{
  position:relative;
  background:var(--color-surface, #fff);
  border:1px solid var(--color-border, #D6CFBE);
  display:flex;flex-direction:column;
  overflow:hidden;
  box-shadow:var(--shadow-1, 0 2px 8px rgba(26,24,20,.06));
}

/* ---------- 头部 ---------- */
.ai-head{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:18px 22px;border-bottom:1px solid var(--color-border, #D6CFBE);
  background:var(--color-bg, #F4F0E6);
  flex:none;
}
.ai-head__t{display:flex;align-items:center;gap:12px;min-width:0;}
.ai-dot{
  width:9px;height:9px;border-radius:50%;background:var(--color-accent, #C8321E);
  flex:none;box-shadow:0 0 0 4px rgba(200,50,30,.14);
  animation:ai-pulse 2.4s ease-in-out infinite;
}
@keyframes ai-pulse{
  0%,100%{box-shadow:0 0 0 4px rgba(200,50,30,.14);}
  50%{box-shadow:0 0 0 7px rgba(200,50,30,.05);}
}
.ai-head__t b{
  display:block;font-family:var(--font-serif, serif);font-size:17px;
  font-weight:700;letter-spacing:2px;color:var(--color-text, #1A1814);
}
.ai-head__t small{
  display:block;margin-top:4px;font-size:12px;color:var(--color-muted, #6E6759);
  letter-spacing:.5px;line-height:1.4;
}
.ai-quota{text-align:right;flex:none;line-height:1.2;}
.ai-quota b{
  display:block;font-family:var(--font-serif, serif);font-size:26px;font-weight:700;
  color:var(--color-accent, #C8321E);
  transition:color var(--dur-base, 320ms) var(--ease-out, ease);
}
.ai-quota span{display:block;font-size:11px;color:var(--color-muted, #6E6759);letter-spacing:1px;margin-top:3px;}
.ai-quota.is-out b{color:var(--color-muted, #6E6759);}

/* ---------- 对话区 ---------- */
.ai-log{
  flex:1;min-height:0;overflow-y:auto;padding:24px 22px;
  display:flex;flex-direction:column;gap:20px;
  scroll-behavior:smooth;
}
.ai-panel:not(.ai-panel--compact) .ai-log{height:440px;}
.ai-panel--compact .ai-log{height:260px;padding:18px;gap:16px;}

.ai-msg{display:flex;gap:12px;align-items:flex-start;animation:ai-in .45s cubic-bezier(0.16,1,0.3,1) both;}
@keyframes ai-in{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:none;}}
.ai-av{
  width:30px;height:30px;border-radius:50%;flex:none;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-serif, serif);font-size:13px;font-weight:700;
}
.ai-msg--bot .ai-av{background:var(--color-text, #1A1814);color:var(--color-bg, #F4F0E6);}
.ai-msg--user .ai-av{background:transparent;border:1px solid var(--color-border-strong, #BDB4A0);color:var(--color-muted, #6E6759);}

.ai-bubble{
  flex:1;min-width:0;font-size:14.5px;line-height:1.85;
  color:var(--color-text-2, #4A463E);
  padding-top:4px;
}
.ai-msg--user .ai-bubble{
  color:var(--color-text, #1A1814);font-weight:500;
  border-left:2px solid var(--color-accent, #C8321E);
  padding-left:14px;
}
.ai-bubble p{margin:0 0 10px;}
.ai-bubble p:last-child{margin-bottom:0;}
.ai-bubble strong{color:var(--color-text, #1A1814);font-weight:700;}
.ai-bubble em{font-style:normal;color:var(--color-accent, #C8321E);font-weight:700;}
.ai-bubble code{
  font-family:var(--font-mono, monospace);font-size:13px;
  background:var(--color-bg-alt, #EDE8DB);padding:1px 5px;border-radius:2px;
}
.ai-bubble ul{margin:6px 0 12px;padding-left:20px;}
.ai-list li{margin-bottom:6px;}
.ai-list li::marker{color:var(--color-accent, #C8321E);}
.ai-bubble hr{border:none;border-top:1px solid var(--color-border, #D6CFBE);margin:14px 0;}

/* AI 回复里的 Markdown 标题 */
.ai-h{
  font-family:var(--font-serif, serif);font-weight:700;letter-spacing:1.5px;
  color:var(--color-text, #1A1814);margin:18px 0 8px;line-height:1.4;
}
.ai-h:first-child{margin-top:0;}
.ai-h1{font-size:19px;}
.ai-h2{font-size:17px;}
.ai-h3{font-size:15.5px;}
.ai-h4{font-size:14.5px;}

/* AI 回复里的表格 */
.ai-tablewrap{
  overflow-x:auto;margin:10px 0 14px;border:1px solid var(--color-border, #D6CFBE);
}
.ai-table{border-collapse:collapse;width:100%;min-width:380px;font-size:13px;}
.ai-table th,.ai-table td{
  border-bottom:1px solid var(--color-border, #D6CFBE);
  border-right:1px solid var(--color-border, #D6CFBE);
  padding:9px 12px;text-align:left;line-height:1.65;vertical-align:top;
}
.ai-table th:last-child,.ai-table td:last-child{border-right:none;}
.ai-table tbody tr:last-child td{border-bottom:none;}
.ai-table th{
  background:var(--color-bg, #F4F0E6);font-weight:700;color:var(--color-text, #1A1814);
  letter-spacing:1px;white-space:nowrap;
}
.ai-table tbody tr:nth-child(even){background:rgba(26,24,20,.025);}

/* 打字动画 */
.ai-bubble--typing{display:flex;gap:5px;align-items:center;padding:8px 0;}
.ai-bubble--typing i{
  width:6px;height:6px;border-radius:50%;background:var(--color-muted, #6E6759);
  animation:ai-dot 1.3s ease-in-out infinite;
}
.ai-bubble--typing i:nth-child(2){animation-delay:.18s;}
.ai-bubble--typing i:nth-child(3){animation-delay:.36s;}
@keyframes ai-dot{0%,60%,100%{opacity:.28;transform:translateY(0);}30%{opacity:1;transform:translateY(-4px);}}

/* ---------- 快捷提问 ---------- */
.ai-suggest{
  display:flex;gap:8px;flex-wrap:wrap;padding:0 22px 14px;flex:none;
}
.ai-suggest button{
  border:1px solid var(--color-border-strong, #BDB4A0);background:transparent;
  color:var(--color-text-2, #4A463E);font-size:12.5px;padding:7px 13px;
  cursor:pointer;transition:all var(--dur-fast, 160ms) ease-out;
  font-family:var(--font-sans, sans-serif);
}
.ai-suggest button:hover{
  border-color:var(--color-accent, #C8321E);color:var(--color-accent, #C8321E);
  background:rgba(200,50,30,.05);
}

/* ---------- 输入区 ---------- */
.ai-input{
  display:flex;gap:10px;align-items:flex-end;padding:0 22px 14px;flex:none;
}
.ai-input textarea{
  flex:1;min-width:0;resize:vertical;min-height:46px;max-height:140px;
  border:1px solid var(--color-border-strong, #BDB4A0);
  background:var(--color-bg, #F4F0E6);
  padding:12px 14px;font-size:14.5px;line-height:1.6;
  font-family:var(--font-sans, sans-serif);color:var(--color-text, #1A1814);
  transition:border-color var(--dur-fast, 160ms) ease-out;
}
.ai-input textarea:focus{outline:none;border-color:var(--color-accent, #C8321E);}
.ai-input textarea:disabled{opacity:.55;cursor:not-allowed;}
.ai-input textarea::placeholder{color:var(--color-muted, #6E6759);}
.ai-send{
  width:46px;height:46px;flex:none;border:none;cursor:pointer;
  background:var(--color-accent, #C8321E);color:#fff;
  display:flex;align-items:center;justify-content:center;
  transition:filter var(--dur-fast, 160ms) ease-out,transform var(--dur-fast, 160ms) ease-out;
}
.ai-send svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.ai-send:hover:not(:disabled){filter:brightness(1.12);transform:translateY(-2px);}
.ai-send:disabled{opacity:.45;cursor:not-allowed;}

/* ---------- 底部 ---------- */
.ai-foot{
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:12px 22px;border-top:1px solid var(--color-border, #D6CFBE);
  font-size:12px;color:var(--color-muted, #6E6759);flex:none;
}
.ai-reset{
  border:none;background:none;cursor:pointer;font-size:12px;
  color:var(--color-muted, #6E6759);text-decoration:underline;
  text-underline-offset:3px;padding:4px 0;
  transition:color var(--dur-fast, 160ms) ease-out;
}
.ai-reset:hover{color:var(--color-accent, #C8321E);}

/* ---------- 触达上限 ---------- */
.ai-lock{
  position:absolute;inset:0;z-index:5;
  background:rgba(244,240,230,.96);
  backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
  display:flex;align-items:center;justify-content:center;padding:28px;
}
.ai-lock[hidden]{display:none;}
.ai-lock__in{max-width:420px;text-align:center;}
.ai-lock__in b{
  display:block;font-family:var(--font-serif, serif);font-size:21px;
  font-weight:700;letter-spacing:2px;color:var(--color-text, #1A1814);
}
.ai-lock__in p{
  margin:16px 0 20px;font-size:14px;line-height:1.9;color:var(--color-text-2, #4A463E);
}
.ai-lock__in em{
  font-style:normal;font-family:var(--font-serif, serif);font-weight:700;
  color:var(--color-accent, #C8321E);letter-spacing:1px;font-size:16px;
}
.ai-copy{
  border:1px solid var(--color-accent, #C8321E);background:var(--color-accent, #C8321E);
  color:#fff;padding:11px 26px;cursor:pointer;font-size:14px;
  font-family:var(--font-serif, serif);letter-spacing:2px;
  transition:filter var(--dur-fast, 160ms) ease-out,transform var(--dur-fast, 160ms) ease-out;
}
.ai-copy:hover{filter:brightness(1.12);transform:translateY(-2px);}

/* ---------- 降级 ---------- */
@media (prefers-reduced-motion:reduce){
  .ai-msg{animation:none;}
  .ai-dot{animation:none;}
  .ai-bubble--typing i{animation:none;opacity:.5;}
  .ai-log{scroll-behavior:auto;}
}

/* ---------- 移动端 ---------- */
@media (max-width:760px){
  .ai-head{padding:14px 16px;gap:12px;}
  .ai-head__t b{font-size:15.5px;letter-spacing:1.5px;}
  .ai-head__t small{font-size:11px;}
  .ai-quota b{font-size:22px;}
  .ai-log{padding:18px 16px;}
  .ai-panel:not(.ai-panel--compact) .ai-log{height:380px;}
  .ai-panel--compact .ai-log{height:230px;}
  .ai-suggest{padding:0 16px 12px;gap:6px;}
  .ai-suggest button{font-size:12px;padding:6px 10px;}
  .ai-input{padding:0 16px 12px;}
  .ai-foot{padding:10px 16px;font-size:11.5px;}
  .ai-av{width:26px;height:26px;font-size:12px;}
  .ai-bubble{font-size:14px;}
}
