.admin-page[data-v-3dbb7afc] { width: 100%; height: 100%; display: flex; flex-direction: column; overflow: hidden; background: #f1f5f9;
}
.header-white[data-v-3dbb7afc] { background: #fff; flex-shrink: 0; padding: 16px; border-bottom: 1px solid #f1f5f9; display: flex; justify-content: space-between; align-items: flex-start;
}
.header-title[data-v-3dbb7afc] { font-size: 20px; font-weight: 700; color: #1e293b;
}
.header-sub[data-v-3dbb7afc] { font-size: 12px; color: #94a3b8; margin-top: 2px;
}
.header-right[data-v-3dbb7afc] { font-size: 12px; color: #64748b; cursor: pointer; padding: 4px 8px; border-radius: 6px; background: #f1f5f9;
}
.content-area[data-v-3dbb7afc] { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 16px;
}
.kpi-grid[data-v-3dbb7afc] { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 20px;
}
.kpi-card[data-v-3dbb7afc] { background: #fff; border-radius: 14px; padding: 14px; display: flex; align-items: center; gap: 10px; box-shadow: 0 1px 2px rgba(0,0,0,0.03);
}
.kpi-icon[data-v-3dbb7afc] { width: 40px; height: 40px; border-radius: 12px; display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.kpi-num[data-v-3dbb7afc] { font-size: 22px; font-weight: 700; color: #1e293b;
}
.kpi-label[data-v-3dbb7afc] { font-size: 11px; color: #94a3b8; margin-top: 2px;
}
.section-title[data-v-3dbb7afc] { display: flex; align-items: center; gap: 8px; font-size: 16px; font-weight: 700; color: #1e293b; margin-bottom: 12px;
}
.badge[data-v-3dbb7afc] { font-size: 11px; padding: 1px 7px; border-radius: 10px; background: #fee2e2; color: #ef4444; font-weight: 600;
}
.loading-state[data-v-3dbb7afc], .empty-state[data-v-3dbb7afc] { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 48px 0; font-size: 14px; color: #94a3b8;
}
.approval-card[data-v-3dbb7afc] { background: #fff; border-radius: 14px; padding: 16px; margin-bottom: 10px; box-shadow: 0 1px 2px rgba(0,0,0,0.03); cursor: pointer;
}
.approval-card[data-v-3dbb7afc]:active { transform: scale(0.985);
}
.approval-top[data-v-3dbb7afc] { margin-bottom: 8px;
}
.tag-green[data-v-3dbb7afc] { font-size: 10px; padding: 2px 8px; border-radius: 10px; font-weight: 500; background: #d1fae5; color: #047857;
}
.tag-ok[data-v-3dbb7afc] { font-size: 10px; padding: 2px 8px; border-radius: 10px; font-weight: 500; background: #d1fae5; color: #047857;
}
.tag-no[data-v-3dbb7afc] { font-size: 10px; padding: 2px 8px; border-radius: 10px; font-weight: 500; background: #fee2e2; color: #b91c1c;
}
.tab-bar[data-v-3dbb7afc] { display: flex; border-bottom: 2px solid #f1f5f9; margin-bottom: 14px;
}
.tab-item[data-v-3dbb7afc] { flex: 1; text-align: center; padding: 10px 0; font-size: 15px; font-weight: 500; color: #94a3b8; position: relative; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 6px;
}
.tab-active[data-v-3dbb7afc] { color: #12a87a;
}
.tab-line[data-v-3dbb7afc] { position: absolute; bottom: -2px; left: 30%; right: 30%; height: 2px; background: #12a87a; border-radius: 2px;
}
.approval-title[data-v-3dbb7afc] { font-size: 14px; font-weight: 600; color: #1e293b; margin-bottom: 8px;
}
.approval-footer[data-v-3dbb7afc] { padding-top: 8px; border-top: 1px solid #f1f5f9; display: flex; justify-content: space-between; align-items: center;
}
.approval-meta[data-v-3dbb7afc] { font-size: 11px; color: #94a3b8;
}
.approval-action[data-v-3dbb7afc] { font-size: 12px; color: #12a87a; font-weight: 500; display: flex; align-items: center; gap: 2px;
}
.detail-sheet[data-v-3dbb7afc] { max-height: 70vh;
}
.detail-panel[data-v-3dbb7afc] { max-height: 60vh; overflow-y: auto; padding: 0 16px 16px;
}
.detail-body[data-v-3dbb7afc] { padding: 8px 0; text-align: center;
}
.detail-section[data-v-3dbb7afc] { text-align: left; margin-bottom: 16px; padding: 12px; background: #f8fafc; border-radius: 10px;
}
.detail-section-title[data-v-3dbb7afc] { font-size: 13px; font-weight: 600; color: #475569; margin-bottom: 8px;
}
.form-row[data-v-3dbb7afc] { display: flex; padding: 6px 0; font-size: 13px; border-bottom: 1px solid #f1f5f9;
}
.form-row[data-v-3dbb7afc]:last-child { border-bottom: none;
}
.form-label[data-v-3dbb7afc] { width: 80px; flex-shrink: 0; color: #94a3b8;
}
.form-value[data-v-3dbb7afc] { color: #334155; word-break: break-all; flex: 1;
}
.fee-empty[data-v-3dbb7afc] { text-align: center; padding: 16px; color: #94a3b8; font-size: 13px;
}
.detail-actions[data-v-3dbb7afc] { display: flex; gap: 10px; padding: 12px 0;
}
.flow-nodes[data-v-3dbb7afc] { display: flex; align-items: center; gap: 2px; overflow-x: auto; padding: 4px 0;
}
.flow-node[data-v-3dbb7afc] { padding: 8px 12px; border-radius: 10px; font-size: 12px; text-align: center; min-width: 64px; background: #f8fafc; border: 2px solid #e2e8f0; flex-shrink: 0;
}
.node-done[data-v-3dbb7afc] { border-color: #12a87a; background: #d1fae5;
}
.node-active[data-v-3dbb7afc] { border-color: #3b82f6; background: #dbeafe;
}
.node-reject[data-v-3dbb7afc] { border-color: #ef4444; background: #fee2e2;
}
.node-name[data-v-3dbb7afc] { font-weight: 600; color: #1e293b;
}
.node-status[data-v-3dbb7afc] { font-size: 10px; color: #64748b; margin-top: 2px;
}
.flow-arrow[data-v-3dbb7afc] { color: #cbd5e1; font-size: 16px; flex-shrink: 0;
}