/* ============================================================
   iAgent base — body / typography / scrollbars / shared primitives
   ============================================================ */

* { box-sizing: border-box; }
html, body, #root { margin: 0; padding: 0; height: 100%; }

body {
  font-family: var(--font-sans);
  font-size: var(--t-base);
  line-height: var(--lh-base);
  color: var(--text-primary);
  background: var(--bg-app);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "ss01", "cv11";
}

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: var(--line); border-radius: var(--r-pill); border: 2px solid var(--bg-app); }
::-webkit-scrollbar-thumb:hover { background: var(--line-strong); }

a { color: var(--text-link); text-decoration: none; }
a:hover { text-decoration: underline; }

.num   { font-family: var(--font-num); font-variant-numeric: tabular-nums; }
.mono  { font-family: var(--font-mono); }
.kbd   {
  display: inline-block; font-family: var(--font-mono); font-size: 10px;
  padding: 1px 5px; border: 1px solid var(--line); border-bottom-width: 2px;
  border-radius: 4px; color: var(--text-secondary); background: var(--bg-canvas);
}

/* ----- brand-mark (顶栏品牌点) ----- */
.brand-mark { display: flex; align-items: center; gap: var(--s-2); font-weight: 600; letter-spacing: -0.01em; }
.brand-dot {
  width: 22px; height: 22px; border-radius: 6px;
  background: var(--brand-500);
  display: grid; place-items: center;
  color: #fff; font-size: 12px; font-weight: 700;
  font-family: var(--font-sans);
}
.brand-crumb { color: var(--text-tertiary); font-size: var(--t-md); white-space: nowrap; }
.brand-crumb b { color: var(--text-primary); font-weight: 500; }

/* ----- pill ----- */
.pill {
  display: inline-flex; align-items: center; gap: 5px;
  height: 22px; padding: 0 8px;
  border-radius: var(--r-pill);
  font-size: 11px; font-weight: 500; letter-spacing: 0.01em;
  font-family: var(--font-sans);
}
.pill .dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }
.pill.neutral { background: var(--bg-sunken); color: var(--text-secondary); border: 1px solid var(--line); }
.pill.brand   { background: color-mix(in oklab, var(--brand-500) 12%, transparent); color: var(--brand-700); }
.pill.success { background: var(--success-50); color: var(--success-700); }
.pill.warning { background: var(--warning-50); color: var(--warning-700); }
.pill.danger  { background: var(--danger-50);  color: var(--danger-700); }
.pill.outline { background: transparent; border: 1px solid var(--line); color: var(--text-secondary); }

[data-theme="dark"] .pill.brand   { color: var(--brand-300); }
[data-theme="dark"] .pill.success { background: color-mix(in oklab, var(--success-500) 14%, transparent); color: #6ee7b7; }
[data-theme="dark"] .pill.warning { background: color-mix(in oklab, var(--warning-500) 14%, transparent); color: #fcd34d; }
[data-theme="dark"] .pill.danger  { background: color-mix(in oklab, var(--danger-500)  14%, transparent); color: #fca5a5; }

/* ----- stamp (AI draft vs human confirmed) ----- */
.stamp {
  display: inline-flex; align-items: center; gap: 5px;
  font-family: var(--font-mono); font-size: 10px;
  letter-spacing: 0.06em; text-transform: uppercase;
  padding: 2px 7px; border-radius: 3px; font-weight: 600;
}
.stamp.draft {
  background: repeating-linear-gradient(135deg,
    color-mix(in oklab, var(--brand-500) 12%, transparent) 0 6px,
    transparent 6px 12px);
  color: var(--brand-700);
  border: 1px dashed var(--brand-500);
}
.stamp.confirmed { background: var(--success-500); color: #fff; }
.stamp.rejected  { background: var(--danger-500);  color: #fff; }
[data-theme="dark"] .stamp.draft { color: var(--brand-300); }

/* ----- Confidence bar ----- */
.conf {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 11px; color: var(--text-secondary); font-family: var(--font-mono);
}
.conf .bar { display: inline-flex; gap: 2px; }
.conf .bar i {
  width: 6px; height: 10px;
  background: var(--line-strong); border-radius: 1px;
  display: inline-block;
}
.conf[data-level="high"] .bar i:nth-child(-n+3) { background: var(--success-500); }
.conf[data-level="med"]  .bar i:nth-child(-n+2) { background: var(--warning-500); }
.conf[data-level="low"]  .bar i:nth-child(-n+1) { background: var(--danger-500); }

/* ----- Bubble retoning (overrides on top of AntD X) ----- */
.bubble {
  max-width: 560px; padding: 10px 14px;
  border-radius: 12px;
  font-size: var(--t-base); line-height: var(--lh-base);
}
.bubble.user {
  background: var(--brand-500); color: #fff;
  align-self: flex-end; border-bottom-right-radius: 4px;
}
.bubble.larry {
  background: var(--bg-sunken); color: var(--text-primary);
  border: 1px solid var(--line-subtle);
  border-bottom-left-radius: 4px;
}
.bubble.system {
  background: transparent; color: var(--text-tertiary);
  font-size: var(--t-sm); text-align: center; max-width: none;
}
.bubble.tool {
  background: color-mix(in oklab, var(--brand-500) 6%, var(--bg-canvas));
  border: 1px solid color-mix(in oklab, var(--brand-500) 18%, transparent);
  padding: var(--s-3); font-family: var(--font-mono);
  font-size: var(--t-sm); color: var(--text-secondary);
  border-radius: var(--r-md);
}
.bubble .caret::after {
  content: "▍"; color: var(--brand-500);
  animation: caret-blink 1s steps(2) infinite; margin-left: 1px;
}
@keyframes caret-blink { 50% { opacity: 0; } }

/* ----- Voucher card (signature 凭证卡片) ----- */
.voucher {
  background: var(--bg-canvas);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  overflow: hidden;
}
.voucher .v-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: var(--s-3) var(--s-4);
  border-bottom: 1px dashed var(--line);
  background: var(--bg-sunken);
  font-size: var(--t-sm); color: var(--text-secondary);
}
.voucher .v-head .meta { display: flex; gap: var(--s-4); flex-wrap: wrap; }
.voucher .v-head .meta b {
  color: var(--text-primary); font-weight: 500;
  font-family: var(--font-mono);
}
.voucher table { width: 100%; border-collapse: collapse; font-size: var(--t-md); }
.voucher th {
  text-align: left; font-weight: 500; color: var(--text-tertiary);
  padding: 8px var(--s-4); font-size: var(--t-sm);
  background: var(--bg-canvas);
  border-bottom: 1px solid var(--line-subtle);
}
.voucher th.amt, .voucher td.amt {
  text-align: right; font-family: var(--font-num);
  font-variant-numeric: tabular-nums;
}
.voucher td {
  padding: 10px var(--s-4);
  border-bottom: 1px solid var(--line-subtle);
}
.voucher tr:last-child td { border-bottom: 0; }
.voucher .dc {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--font-mono); font-size: 11px; font-weight: 600;
  padding: 1px 6px; border-radius: 4px;
}
.voucher .dc.debit  { background: var(--debit-50);  color: var(--debit-500); }
.voucher .dc.credit { background: var(--credit-50); color: var(--credit-500); }
[data-theme="dark"] .voucher .dc.debit  { background: color-mix(in oklab, var(--debit-500)  16%, transparent); color: var(--debit-500); }
[data-theme="dark"] .voucher .dc.credit { background: color-mix(in oklab, var(--credit-500) 16%, transparent); color: var(--credit-500); }
.voucher .totals td {
  font-weight: 600; background: var(--bg-sunken);
  border-top: 1px solid var(--line);
}
.voucher .v-foot {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--s-3); flex-wrap: wrap;
  padding: var(--s-3) var(--s-4);
  border-top: 1px solid var(--line);
  background: var(--bg-canvas);
}

/* ----- Inbox item ----- */
.inbox-item {
  display: grid; grid-template-columns: auto 1fr auto; gap: var(--s-3);
  padding: var(--s-3) var(--s-4);
  border-bottom: 1px solid var(--line-subtle);
  align-items: center; background: var(--bg-canvas);
}
.inbox-item:hover { background: var(--bg-hover); }
.inbox-item .marker { width: 4px; height: 32px; border-radius: 2px; background: var(--line); }
.inbox-item[data-priority="urgent"]    .marker { background: var(--danger-500); }
.inbox-item[data-priority="important"] .marker { background: var(--warning-500); }
.inbox-item[data-priority="normal"]    .marker { background: var(--brand-500); }
.inbox-item .meta {
  font-family: var(--font-mono); font-size: 11px;
  color: var(--text-tertiary); white-space: nowrap;
}
.inbox-item .title { font-weight: 500; font-size: var(--t-md); }
.inbox-item .sub   { font-size: var(--t-sm); color: var(--text-secondary); margin-top: 2px; }

/* ----- KPI ----- */
.kpi { display: flex; flex-direction: column; gap: 2px; }
.kpi .lab {
  font-size: 11px; color: var(--text-tertiary);
  text-transform: uppercase; letter-spacing: 0.05em; font-weight: 600;
}
.kpi .val {
  font-family: var(--font-num); font-size: var(--t-xl);
  font-weight: 600; letter-spacing: -0.01em;
}
.kpi .val.up   { color: var(--success-600); }
.kpi .val.down { color: var(--danger-600); }

/* ----- Misc utility helpers (light, opinion-free) ----- */
.row { display: flex; align-items: center; gap: var(--s-3); }
.col { display: flex; flex-direction: column; gap: var(--s-3); }
.between { justify-content: space-between; }
.wrap    { flex-wrap: wrap; }
.full    { width: 100%; }
.text-tertiary  { color: var(--text-tertiary); }
.text-secondary { color: var(--text-secondary); }
.text-primary   { color: var(--text-primary); }
.fs-sm  { font-size: var(--t-sm); }
.fs-md  { font-size: var(--t-md); }
.fs-base{ font-size: var(--t-base); }
.fw-500 { font-weight: 500; }
.fw-600 { font-weight: 600; }

/* ----- Theme toggle pill ----- */
.theme-toggle {
  display: inline-flex; align-items: center; gap: var(--s-2);
  height: 28px; padding: 0 var(--s-3);
  border: 1px solid var(--line); border-radius: var(--r-pill);
  background: var(--bg-canvas);
  font-size: var(--t-sm); color: var(--text-secondary);
  cursor: pointer;
  transition: background var(--d-fast) var(--ease-std);
  font-family: inherit;
}
.theme-toggle:hover { background: var(--bg-hover); }
.theme-toggle .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--brand-500); }

/* ----- AntD overrides — 把默认皮肤拉到 Stripe / shadcn / Linear 中性现代风 ----- */
.ant-btn-primary { box-shadow: none !important; }
.ant-btn:focus-visible { outline: none; box-shadow: var(--focus-ring) !important; }
.ant-card { border-color: var(--line); }
.ant-input, .ant-input-password, .ant-input-affix-wrapper, .ant-select-selector {
  border-color: var(--line) !important;
}
.ant-input:focus, .ant-input-focused,
.ant-input-affix-wrapper:focus, .ant-input-affix-wrapper-focused,
.ant-select-focused .ant-select-selector {
  border-color: var(--brand-500) !important;
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--brand-500) 22%, transparent) !important;
}

/* Bubble in AntD X — keep the library default DOM, just retone */
.ant-bubble-content {
  font-family: var(--font-sans) !important;
}
