/* 现金支出审批表 + 现金日记账系统 公共样式 */
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
    font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
    font-size: 14px; color: #2b2b2b; background: #f2f4f7;
}
a { color: #1e4e8c; text-decoration: none; }
a:hover { text-decoration: underline; }

/* 顶栏 */
.topbar {
    background: #1e4e8c; color: #fff; padding: 0 20px;
    display: flex; align-items: center; justify-content: space-between;
    height: 52px; flex-wrap: wrap;
}
.topbar .brand { font-size: 17px; font-weight: 600; letter-spacing: 1px; }
.topbar .user { font-size: 13px; opacity: .95; }
.topbar .user a { color: #fff; margin-left: 12px; }

/* 导航 */
.nav {
    background: #fff; border-bottom: 1px solid #d9dee5;
    padding: 0 20px; display: flex; gap: 4px; flex-wrap: wrap;
}
.nav a {
    display: inline-block; padding: 11px 18px; font-size: 14px; color: #333;
}
.nav a.active, .nav a:hover {
    color: #1e4e8c; font-weight: 600; background: #eef3fa; text-decoration: none;
}

.wrap { max-width: 1100px; margin: 18px auto; padding: 0 16px; }

/* 卡片 */
.card {
    background: #fff; border: 1px solid #d9dee5; border-radius: 8px;
    padding: 16px; margin-bottom: 16px;
}
.card h2 { font-size: 16px; margin-bottom: 12px; color: #1e4e8c; }
.card h3 { font-size: 14px; margin: 14px 0 8px; }

/* 统计卡片 */
.stats { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.stat {
    flex: 1 1 180px; background: #fff; border: 1px solid #d9dee5;
    border-radius: 8px; padding: 14px 16px;
}
.stat .label { font-size: 12px; color: #6b7280; }
.stat .value { font-size: 22px; font-weight: 700; color: #1e4e8c; margin-top: 4px; }
.stat .sub { font-size: 12px; color: #6b7280; margin-top: 2px; }

/* 表格 */
table.list { width: 100%; border-collapse: collapse; background: #fff; }
table.list th, table.list td {
    border: 1px solid #d9dee5; padding: 7px 9px; font-size: 13px;
    text-align: left; vertical-align: middle;
}
table.list th { background: #eef3fa; font-weight: 600; white-space: nowrap; }
table.list tr:nth-child(even) td { background: #fafbfc; }
table.list .num { text-align: right; font-variant-numeric: tabular-nums; }
table.list .center { text-align: center; }

/* 按钮 */
.btn {
    display: inline-block; border: 1px solid #1e4e8c; background: #1e4e8c;
    color: #fff; padding: 7px 16px; border-radius: 5px; font-size: 13px;
    cursor: pointer;
}
.btn:hover { background: #173c6d; text-decoration: none; }
.btn-light {
    background: #fff; color: #1e4e8c; border: 1px solid #1e4e8c;
}
.btn-light:hover { background: #eef3fa; }
.btn-warn { background: #b7791f; border-color: #b7791f; }
.btn-warn:hover { background: #96640f; }
.btn-danger { background: #c0392b; border-color: #c0392b; }
.btn-danger:hover { background: #a93226; }
.btn-sm { padding: 3px 10px; font-size: 12px; }
.btn:disabled { background: #9aa7b8; border-color: #9aa7b8; cursor: not-allowed; }

/* 表单 */
label.lbl { display: block; margin: 10px 0 4px; font-size: 13px; color: #444; }
input[type=text], input[type=password], input[type=date], input[type=number], select, textarea {
    width: 100%; padding: 7px 10px; border: 1px solid #b9c2cd; border-radius: 5px;
    font-size: 14px; font-family: inherit;
}
input:focus, select:focus, textarea:focus { outline: none; border-color: #1e4e8c; }
.form-row { display: flex; gap: 14px; flex-wrap: wrap; }
.form-row > div { flex: 1 1 200px; min-width: 0; }
.form-actions { margin-top: 16px; display: flex; gap: 10px; flex-wrap: wrap; }

/* 提示 */
.flash {
    background: #e8f4e8; border: 1px solid #9ccb9c; color: #256325;
    padding: 9px 14px; border-radius: 5px; margin-bottom: 14px; font-size: 13px;
}

/* 徽标 */
.badge { display: inline-block; padding: 1px 8px; border-radius: 9px; font-size: 12px; }
.badge-gray { background: #e5e7eb; color: #4b5563; }
.badge-blue { background: #dbeafe; color: #1e4e8c; }
.badge-green { background: #d1fae5; color: #0f6b3f; }
.badge-orange { background: #fef3c7; color: #92400e; }

/* 登录页 */
.login-body {
    min-height: 100vh; display: flex; align-items: center; justify-content: center;
    background: linear-gradient(160deg, #1e4e8c 0%, #2f6cb3 100%);
}
.login-box {
    width: 360px; max-width: 92vw; background: #fff; border-radius: 10px;
    padding: 30px 28px; box-shadow: 0 8px 30px rgba(0,0,0,.18);
}
.login-box h1 { font-size: 18px; color: #1e4e8c; text-align: center; margin-bottom: 4px; }
.login-box .sub { text-align: center; color: #6b7280; font-size: 13px; margin-bottom: 18px; }
.login-box .btn { width: 100%; margin-top: 8px; }
.login-box .err { color: #c0392b; font-size: 13px; margin-bottom: 8px; text-align: center; }

/* 打印区（审批表打印页专用） */
.no-print { margin-bottom: 12px; }

/* 表格横向滚动容器（手机端） */
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.table-scroll table.list { min-width: 760px; }
.table-scroll table.list.narrow { min-width: 0; }

/* ===== 手机端适配（≤760px） ===== */
@media (max-width: 760px) {
    .topbar { height: auto; padding: 8px 12px; gap: 6px; }
    .topbar .brand { font-size: 15px; }
    .topbar .user { font-size: 12px; }
    .topbar .user a { margin-left: 8px; }

    .nav { padding: 0 8px; flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .nav a { padding: 12px 13px; font-size: 13.5px; white-space: nowrap; }

    .wrap { margin: 10px auto; padding: 0 8px; }

    .card { padding: 12px; }
    .card h2 { font-size: 15px; }

    .stat { flex: 1 1 46%; padding: 10px 12px; }
    .stat .value { font-size: 18px; }

    /* 表单单列 */
    .form-row { gap: 8px; }
    .form-row > div { flex: 1 1 100%; }

    /* 触控目标 ≥ 44px */
    .btn { padding: 10px 16px; font-size: 14px; min-height: 44px; }
    .btn-sm { padding: 8px 12px; min-height: 40px; }
    input[type=text], input[type=password], input[type=date], input[type=number], select {
        padding: 10px; font-size: 16px;
    }
    .form-actions { gap: 8px; }
    .form-actions .btn { flex: 1 1 auto; text-align: center; }
}