* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; background:#f5f6fa; color:#333; -webkit-font-smoothing:antialiased; }
:root { --primary:#667eea; --primary-dark:#764ba2; --danger:#C62828; --success:#2E7D32; --warning:#E65100; --blue:#1565C0; --purple:#6A1B9A; --gray:#999; }

/* Login */
.login-page { min-height:100vh; display:flex; flex-direction:column; align-items:center; justify-content:center; background:linear-gradient(135deg,#667eea 0%,#764ba2 100%); }
.login-logo { font-size:64px; margin-bottom:8px; }
.login-title { color:#fff; font-size:28px; font-weight:700; margin-bottom:4px; }
.login-sub { color:rgba(255,255,255,.7); font-size:14px; margin-bottom:16px; }
.login-page .van-cell-group { border-radius:12px; overflow:hidden; }
.login-hint { color:rgba(255,255,255,.5); font-size:12px; margin-top:16px; text-align:center; }
.gradient-btn { background:linear-gradient(135deg,#667eea 0%,#764ba2 100%) !important; border:none !important; }

/* Header */
.user-header { background:linear-gradient(135deg,#667eea 0%,#764ba2 100%); color:#fff; padding:20px 16px 16px; text-align:center; }
.user-header h2 { margin:0; font-size:20px; color:#fff; }
.user-header p { margin:4px 0 0; opacity:.85; font-size:14px; }

/* Section */
.section-pad { padding:0 0 80px; }
.section-title-sm { font-size:15px; font-weight:600; color:#333; padding:12px 16px 8px; }
.resubmit-hint { margin-bottom:4px; }

/* Mode switch */
.mode-switch { padding:12px 16px; }
.mode-switch .van-radio-group { gap:16px; }

/* Category */
.cat-section { padding:0 16px 8px; }
.cat-label { font-size:14px; font-weight:500; color:#666; margin-bottom:8px; }
.cat-grid { display:flex; flex-wrap:wrap; gap:8px; }
.cat-chip { padding:8px 14px; border-radius:20px; background:#f5f5f5; font-size:13px; cursor:pointer; transition:all .2s; }
.cat-chip.active { background:linear-gradient(135deg,#667eea 0%,#764ba2 100%); color:#fff; }
.cat-chip:active { transform:scale(.95); }

/* Upload */
.upload-area { margin:8px 16px; border:2px dashed #ddd; border-radius:12px; display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:180px; overflow:hidden; cursor:pointer; background:#fafafa; }
.upload-area:active { background:#f0f0f0; }
.upload-placeholder { text-align:center; }
.upload-placeholder p { color:#999; font-size:14px; margin-top:6px; }
.upload-hint { font-size:12px !important; color:#bbb !important; }
.upload-preview { width:100%; max-height:300px; object-fit:contain; }
.tip-box { margin:12px 16px; padding:12px; background:#e8f0fe; border-radius:8px; font-size:13px; color:#4a90d9; }

/* Batch */
.batch-thumbs { display:flex; gap:8px; padding:8px 16px; overflow-x:auto; }
.batch-thumb { flex-shrink:0; text-align:center; }
.thumb-img { width:60px; height:60px; object-fit:cover; border-radius:8px; }
.thumb-name { display:block; font-size:10px; color:#999; margin-top:2px; max-width:60px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.batch-summary { text-align:center; padding:12px; font-size:14px; font-weight:600; color:#333; }
.batch-item-thumb { width:48px; height:48px; object-fit:cover; border-radius:6px; margin-right:10px; border:1px solid #eee; cursor:pointer; flex-shrink:0; }

/* Batch form fields */
.batch-form-fields { border-top:1px solid #f0f0f0; }
.batch-field-row { display:flex; align-items:center; padding:10px 16px; border-bottom:1px solid #f5f5f5; font-size:14px; }
.batch-field-row:last-child { border-bottom:none; }
.batch-field-row label { width:50px; color:#646566; flex-shrink:0; }
.batch-field-val { flex:1; text-align:right; color:#333; }
.batch-field-val.link { color:var(--primary); cursor:pointer; }
.batch-field-input { flex:1; border:none; outline:none; text-align:right; font-size:14px; color:#333; background:transparent; }
.batch-field-input::placeholder { color:#c8c9cc; }
.batch-field-unit { color:#646566; margin-left:4px; flex-shrink:0; }

/* Records */
.summary-card { background:#fff; margin:12px; border-radius:16px; padding:20px; text-align:center; box-shadow:0 2px 12px rgba(0,0,0,.06); }
.summary-label { color:#888; font-size:13px; }
.summary-amount { font-size:28px; font-weight:700; color:#333; margin-top:4px; }

.record-card { background:#fff; margin:8px 12px; border-radius:12px; padding:14px 16px; box-shadow:0 1px 6px rgba(0,0,0,.05); border-left:4px solid var(--primary); }
.record-card.batch-card { border-left-color:#FF9800; }
.record-top { display:flex; justify-content:space-between; align-items:center; }
.record-cat { font-size:15px; font-weight:600; }
.record-mid { display:flex; justify-content:space-between; align-items:center; margin-top:6px; }
.record-amount { font-size:20px; font-weight:700; color:#333; }
.record-meta { font-size:12px; color:#999; }
.record-desc { font-size:13px; color:#666; margin-top:4px; }
.record-flag { font-size:12px; color:var(--purple); margin-top:4px; }

.batch-detail-toggle { font-size:13px; color:var(--primary); margin-top:8px; cursor:pointer; display:flex; align-items:center; gap:4px; }
.batch-detail-list { margin-top:8px; padding-top:8px; border-top:1px solid #f0f0f0; }
.batch-detail-item { display:flex; flex-wrap:wrap; gap:8px; padding:4px 0; font-size:13px; align-items:center; }

/* Status badges */
.status-badge { padding:3px 10px; border-radius:20px; font-size:12px; font-weight:600; display:inline-block; }
.status-pending { background:#FFF3E0; color:#E65100; }
.status-approved { background:#E3F2FD; color:#1565C0; }
.status-payment_pending { background:#E3F2FD; color:#1565C0; }
.status-paid { background:#E8F5E9; color:#2E7D32; }
.status-rejected { background:#FFEBEE; color:#C62828; }
.status-needs_review,.status-review_needed { background:#F3E5F5; color:#6A1B9A; }

/* Profile */
.profile-card { background:#fff; margin:12px; border-radius:16px; padding:24px 16px; box-shadow:0 2px 12px rgba(0,0,0,.06); }
.profile-avatar-wrap { text-align:center; margin-bottom:16px; }
.profile-avatar { width:72px; height:72px; border-radius:50%; background:linear-gradient(135deg,#667eea 0%,#764ba2 100%); display:inline-flex; align-items:center; justify-content:center; font-size:32px; color:#fff; margin-bottom:8px; }
.profile-name { font-size:20px; font-weight:700; }
.profile-role { font-size:14px; color:#888; margin-top:2px; }
.profile-info { border-top:1px solid #f0f0f0; padding-top:16px; }
.info-row { display:flex; justify-content:space-between; padding:8px 0; }
.info-label { color:#888; font-size:14px; }
.info-val { font-weight:500; font-size:14px; }

.stats-card-v2 { background:#fff; margin:12px; border-radius:16px; padding:16px; box-shadow:0 2px 12px rgba(0,0,0,.06); }
.stats-title { font-weight:600; font-size:15px; margin-bottom:12px; }
.stats-main { display:flex; justify-content:space-around; text-align:center; margin-bottom:12px; }
.stat-block .stat-num { font-size:22px; font-weight:700; }
.stat-block .stat-num.primary { color:var(--primary); }
.stat-block .stat-num.dark { color:#333; }
.stat-block .stat-txt { font-size:12px; color:#888; margin-top:2px; }
.stats-sub { display:flex; justify-content:space-around; text-align:center; padding-top:12px; border-top:1px solid #f0f0f0; }
.stat-mini { display:flex; flex-direction:column; align-items:center; }
.stat-mini-num { font-size:14px; font-weight:600; }
.stat-mini-num.pending { color:var(--warning); }
.stat-mini-num.approved { color:var(--blue); }
.stat-mini-num.paid { color:var(--success); }
.stat-mini-num.rejected { color:var(--danger); }
.stat-mini-txt { font-size:11px; color:#888; margin-top:2px; }

.profile-hint { text-align:center; font-size:12px; color:#bbb; padding:16px; }

/* === Multi-draft 新建报销 === */
.draft-card { background:#fff; margin:8px 12px; border-radius:14px; padding:12px 12px 4px; box-shadow:0 1px 8px rgba(0,0,0,.06); border-left:4px solid #667eea; }
.draft-head { display:flex; align-items:center; padding:2px 4px 10px; border-bottom:1px solid #f3f3f3; margin-bottom:8px; }
.draft-no { font-size:15px; font-weight:600; color:#333; }
.draft-amt { font-size:14px; color:#fa8c16; font-weight:600; }

.draft-invoices { display:flex; flex-wrap:wrap; gap:8px; padding:4px 4px 10px; }
.invoice-thumb-wrap { position:relative; width:72px; height:72px; border-radius:8px; overflow:hidden; border:1px solid #eee; background:#fafafa; }
.invoice-thumb { width:100%; height:100%; object-fit:cover; cursor:zoom-in; }
.invoice-del { position:absolute; top:0; right:0; width:20px; height:20px; line-height:18px; text-align:center; background:rgba(0,0,0,.55); color:#fff; font-size:13px; border-bottom-left-radius:8px; cursor:pointer; }
.invoice-ai-tag { position:absolute; bottom:0; left:0; right:0; background:rgba(25,137,250,.85); color:#fff; font-size:10px; text-align:center; padding:1px 0; }
.invoice-ai-loading { position:absolute; bottom:0; left:0; right:0; background:rgba(0,0,0,.55); color:#fff; font-size:10px; text-align:center; padding:1px 0; }
.invoice-add { width:72px; height:72px; border:1.5px dashed #cdd; border-radius:8px; display:flex; flex-direction:column; align-items:center; justify-content:center; cursor:pointer; background:#fbfbfd; }
.invoice-add:active { background:#f0f0f5; }

/* 单张明细：展开后的发票级金额编辑列表 */
.batch-field-readonly .batch-field-input { color:#999; background:#f7f8fa; padding:4px 8px; border-radius:6px; }
.batch-field-unit { color:#999; font-size:12px; margin-left:6px; }
.invoice-detail-list { padding:6px 12px 4px; background:#f7f8fa; border-bottom:1px solid #f5f5f5; }
.invoice-detail-row { display:flex; align-items:center; gap:10px; padding:8px 4px; border-bottom:1px dashed #eaeaea; }
.invoice-detail-row:last-child { border-bottom:none; }
.invoice-detail-thumb { width:46px; height:46px; object-fit:cover; border-radius:6px; border:1px solid #eee; cursor:zoom-in; flex-shrink:0; }
.invoice-detail-info { flex:1; min-width:0; }
.invoice-detail-title { font-size:12px; color:#646566; margin-bottom:4px; display:flex; align-items:center; gap:6px; }
.invoice-detail-title .ai-tag { background:rgba(25,137,250,.1); color:#1989fa; padding:1px 6px; border-radius:3px; font-size:10px; }
.invoice-detail-amt-row { display:flex; align-items:center; gap:6px; }
.invoice-detail-amt-row .amt-label { font-size:13px; color:#333; width:34px; }
.invoice-detail-input { flex:1; border:1px solid #e6e6e6; outline:none; padding:5px 8px; border-radius:6px; font-size:14px; background:#fff; }
.invoice-detail-input:focus { border-color:var(--primary); }
.invoice-detail-amt-row .amt-unit { color:#999; font-size:12px; }

/* ⚠️ 发票金额=0 时的红色警示样式（AI 未识别 / 手写单 必须手填） */
.invoice-thumb-wrap.invoice-need-fill { border:2px solid #ee0a24; box-shadow:0 0 0 2px rgba(238,10,36,.15); animation: needfill-pulse 1.8s ease-in-out infinite; }
@keyframes needfill-pulse { 0%,100% { box-shadow:0 0 0 2px rgba(238,10,36,.12); } 50% { box-shadow:0 0 0 4px rgba(238,10,36,.32); } }
.invoice-need-fill-tag { position:absolute; bottom:0; left:0; right:0; background:#ee0a24; color:#fff; font-size:10px; text-align:center; padding:2px 0; font-weight:600; cursor:pointer; }
.invoice-detail-row.invoice-detail-need-fill { background:#fff5f5; border-radius:6px; padding-left:6px; padding-right:6px; border-bottom-color:#fcc; }
.invoice-detail-input.invoice-detail-input-warn { border-color:#ee0a24; background:#fff8f8; }
.invoice-detail-title .ai-tag.ai-tag-warn { background:rgba(238,10,36,.12); color:#ee0a24; font-weight:600; }

.batch-detail-item-v2 { padding:8px 0; border-bottom:1px dashed #eee; }
.batch-detail-item-v2:last-child { border-bottom:none; }
.batch-detail-row { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:13px; }
.batch-detail-imgs { display:flex; flex-wrap:wrap; gap:6px; margin-top:6px; }
.batch-detail-img { width:54px; height:54px; object-fit:cover; border-radius:6px; cursor:zoom-in; border:1px solid #eee; }


/* ============== 考勤 Tab (#283) ============== */
.att-today-card { background:linear-gradient(135deg,#1d3a8c,#3858b8); margin:12px; padding:18px 16px; border-radius:14px; color:#fff; box-shadow:0 4px 14px rgba(29,58,140,.25); }
.att-today-header { margin-bottom:14px; }
.att-status-row { display:flex; gap:12px; margin:14px 0; }
.att-status-item { flex:1; background:rgba(255,255,255,.12); padding:10px; border-radius:8px; text-align:center; }
.att-status-label { font-size:12px; color:rgba(255,255,255,.75); margin-bottom:4px; }
.att-status-val { font-size:18px; font-weight:600; opacity:.55; }
.att-status-val.filled { opacity:1; }
.att-punch-row { margin-top:10px; }

.att-cal-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:4px; }
.att-cal-head { text-align:center; font-size:12px; color:#909399; padding:6px 0; font-weight:600; }
.att-cal-cell { background:#fff; border-radius:8px; display:flex; flex-direction:column; align-items:center; padding:6px 2px 4px; position:relative; min-height:62px; cursor:pointer; transition:all .15s; }
.att-cal-cell.empty { background:transparent; }
.att-cal-cell.today { background:#f0f9ff; outline:2px solid #4cb8c4; outline-offset:-2px; }
.att-cal-cell.past { opacity:.55; }
.att-cal-cell.weekend .att-cal-day { color:#67c23a; }
.att-cal-day { font-size:15px; color:#303133; font-weight:600; line-height:1.1; }
.att-cal-shift-tag { margin-top:4px; padding:2px 5px; font-size:10px; font-weight:600; color:#fff; border-radius:3px; line-height:1.3; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.att-cal-rec-dot { position:absolute; top:4px; right:4px; width:6px; height:6px; border-radius:50%; }

/* 今日详情卡（日历下方） */
.att-today-detail { background:#fff; margin:12px; padding:14px 16px; border-radius:8px; border-left:4px solid #4cb8c4; }
.att-today-detail-title { font-size:13px; color:#909399; margin-bottom:6px; }
.att-today-detail-shift { font-size:18px; font-weight:600; margin-bottom:4px; color:#67c23a; }
.att-today-detail-time { font-size:14px; color:#909399; }

/* 月度班次统计 */
.att-stats-card { background:#fff; margin:12px; padding:14px 16px; border-radius:8px; }
.att-stats-title { font-size:14px; font-weight:600; color:#303133; margin-bottom:10px; display:flex; align-items:center; gap:6px; }
.att-stats-row { display:flex; align-items:center; padding:7px 0; gap:10px; }
.att-stats-name { width:64px; font-size:13px; color:#303133; font-weight:500; flex-shrink:0; }
.att-stats-bar { flex:1; height:6px; background:#f0f2f5; border-radius:3px; overflow:hidden; }
.att-stats-bar-fill { height:100%; border-radius:3px; transition:width .3s; }
.att-stats-count { width:46px; text-align:right; font-size:13px; color:#67c23a; font-weight:600; flex-shrink:0; }

.att-leave-item { padding:10px 0; border-bottom:1px solid #f5f5f5; }
.att-leave-item:last-child { border-bottom:none; }
