/* 记账业务层：收支语义色与跨页面共用的小组件。tokens 引用 ui-base 的图表色，深浅主题自动跟随。 */
:root {
    --income: var(--chart-5);
    --expense: var(--chart-3);
}

.amount-income { color: var(--income); }
.amount-expense { color: var(--expense); }
.stat.amount-expense { color: var(--expense); }
/* .table td 默认是次要文字色，收支金额需要更高优先级才能保留颜色 */
.table td.amount-income { color: var(--income); }
.table td.amount-expense { color: var(--expense); }
.table td.amount-transfer { color: var(--accent-cyan); }
.grow { flex: 1; min-width: 0; }
.link { color: var(--accent-blue); text-decoration: none; }
.link:hover { text-decoration: underline; text-underline-offset: 3px; }

/* 普通页面里的提示条（flash 之外）：图标与文字同行 */
.container > .alert { display: flex; align-items: flex-start; gap: var(--space-3); }

/* card-flush 里的标题行补回内边距 */
.card-pad { margin: 0; padding: var(--space-5) var(--space-6); border-bottom: 1px solid var(--line); }

/* 图例色块：chart-legend 的 i 默认是细线，这里复用 bg-c* 的颜色 */
.chart-legend i.bg-c3 { background: var(--chart-3); }
.chart-legend i.bg-c5 { background: var(--chart-5); }

/* 密码显示切换：登录页与改密页共用 */
.password-control { position: relative; }
.password-control .input { padding-right: 64px; }
.password-toggle { position: absolute; top: 50%; right: 4px; min-height: 32px; padding: 4px 9px; transform: translateY(-50%); border: 0; border-radius: var(--radius-sm); background: transparent; color: var(--accent-blue); font-size: var(--text-xs); font-weight: 550; cursor: pointer; }
.password-toggle:hover { background: var(--surface-hover); }

/* 记一笔弹窗：收支切换放大、按语义着色，金额输入用大号等宽字 */
.entry-type-tabs { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
.entry-type-tabs label { padding: 10px 14px; text-align: center; font-weight: 600; }
.entry-type-tabs label.is-expense:has(input:checked) { color: var(--expense); background: color-mix(in srgb, var(--expense) 14%, transparent); }
.entry-type-tabs label.is-income:has(input:checked) { color: var(--income); background: color-mix(in srgb, var(--income) 14%, transparent); }
.entry-type-tabs label:has(input:focus-visible) { outline: 2px solid var(--accent-cyan); outline-offset: 2px; }
.entry-amount-input { min-height: 52px; font-family: var(--font-mono); font-size: 1.5rem; font-variant-numeric: tabular-nums; }
.entry-note-input { min-height: 72px; }
.form-card { max-width: 760px; }

@media (max-width: 820px) {
    /* 窄屏弹窗贴底，单手更好操作 */
    .dialog:not(.drawer) { width: 100%; max-width: 100%; margin: auto 0 0; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
}