/* Boluomiduo 全站公共 UI：设计令牌 + 高频组件。
 * 页面在 <head> 引入 <link rel="stylesheet" href="/comp/ui.css"> 后，
 * 删除本地同名规则即可；页面 <style> 在其后声明仍可按需覆盖。 */

:root {
  --b-blue: #2f6fed;
  --b-ink: #1f2430;
  --b-muted: #9aa2b1;
  --b-line: #e4e8f0;
  --b-line2: #d7dce6;
  --b-bg: #f4f6fa;
}

/* 卡片 */
.card { background: #fff; border: 1px solid var(--b-line); border-radius: 14px;
  padding: 22px; margin-bottom: 16px; }

/* 胶囊页签（选品 / 创品 / 评论分析） */
.tabs { display: flex; justify-content: center; gap: 12px; margin-bottom: 28px; }
.tab { padding: 8px 20px; border-radius: 999px; border: 1px solid var(--b-line2);
  background: #fff; font-size: 14px; color: #333; }
.tab.active { border-color: var(--b-blue); color: var(--b-blue); font-weight: 700; }
.tab.soon, .tab.disabled { color: var(--b-muted); border-style: dashed; cursor: not-allowed; }
.tab.disabled { background: #f6f8fb; }

/* 圆形发送按钮 */
.send { width: 48px; height: 48px; border-radius: 50%; border: 0; background: var(--b-blue);
  color: #fff; font-size: 18px; cursor: pointer; flex-shrink: 0; }
.send:disabled { opacity: .5; cursor: wait; }

/* 表单：标签 + 输入框壳 + 单位 */
.field { margin-bottom: 12px; }
.field label { display: block; font-size: 12px; color: #6b7280; margin-bottom: 5px; }
.input-wrap { display: flex; align-items: center; border: 1px solid var(--b-line2);
  border-radius: 9px; background: #fff; overflow: hidden; }
.input-wrap:focus-within { border-color: var(--b-blue); }
.input-wrap input, .input-wrap select { flex: 1 1 auto; width: auto; min-width: 0;
  border: 0; outline: 0; padding: 10px 12px; font-size: 14px; background: transparent;
  color: var(--b-ink); }
.unit { padding: 0 12px; font-size: 13px; color: var(--b-muted); white-space: nowrap;
  flex: 0 0 auto; }