/* 图书管理系统 · 手写简版  通用样式(预制前端) */
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
    font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
    background: #f4f6fa; color: #1f2937; line-height: 1.6;
}
a { color: #2563eb; text-decoration: none; }
a:hover { text-decoration: underline; }

/* 顶部导航 */
.navbar {
    background: #1e293b; color: #fff; padding: 0 24px;
    display: flex; align-items: center; height: 56px;
    box-shadow: 0 1px 6px rgba(0,0,0,.12);
}
.navbar .brand { font-size: 18px; font-weight: 800; margin-right: 32px; color: #fff; }
.navbar .brand span { color: #60a5fa; }
.navbar .menu { display: flex; gap: 4px; flex: 1; }
.navbar .menu a { color: #cbd5e1; padding: 8px 14px; border-radius: 6px; font-size: 14px; }
.navbar .menu a:hover { background: #334155; color: #fff; text-decoration: none; }
.navbar .user { font-size: 13px; color: #cbd5e1; }
.navbar .user b { color: #fff; }
.navbar .user a { color: #f87171; margin-left: 12px; }
.tag-admin { background:#7c3aed; color:#fff; font-size:11px; padding:1px 7px; border-radius:10px; margin-left:6px;}
.tag-reader { background:#0891b2; color:#fff; font-size:11px; padding:1px 7px; border-radius:10px; margin-left:6px;}

/* 容器 */
.container { max-width: 1100px; margin: 24px auto; padding: 0 20px; }
.page-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
.page-head h2 { font-size: 22px; font-weight: 800; }

/* 卡片 */
.card { background:#fff; border-radius:12px; box-shadow:0 1px 4px rgba(15,23,42,.06); padding:20px; }

/* 搜索栏 */
.toolbar { display:flex; gap:10px; align-items:center; margin-bottom:16px; flex-wrap:wrap; }
.toolbar input, .toolbar select {
    height:36px; padding:0 12px; border:1px solid #d1d5db; border-radius:8px; font-size:14px;
}

/* 按钮 */
.btn { display:inline-block; height:36px; line-height:36px; padding:0 16px; border-radius:8px;
       font-size:14px; border:none; cursor:pointer; color:#fff; background:#2563eb; }
.btn:hover { background:#1d4ed8; text-decoration:none; color:#fff; }
.btn-sm { height:30px; line-height:30px; padding:0 12px; font-size:13px; }
.btn-gray { background:#6b7280; } .btn-gray:hover{ background:#4b5563; }
.btn-green { background:#10b981; } .btn-green:hover{ background:#059669; }
.btn-red { background:#ef4444; } .btn-red:hover{ background:#dc2626; }

/* 表格 */
table { width:100%; border-collapse:collapse; background:#fff; border-radius:12px; overflow:hidden; }
thead th { background:#f1f5f9; color:#334155; font-size:13px; text-align:left; padding:12px 14px; }
tbody td { padding:11px 14px; border-top:1px solid #eef2f7; font-size:14px; vertical-align:middle; }
tbody tr:hover { background:#f8fafc; }
.cover { width:40px; height:54px; object-fit:cover; border-radius:4px; background:#e5e7eb; }
.avatar { width:36px; height:36px; border-radius:50%; object-fit:cover; background:#e5e7eb; }

/* 状态徽标 */
.badge { font-size:12px; padding:2px 9px; border-radius:10px; }
.badge-1 { background:#dbeafe; color:#1d4ed8; } /* 借出中 */
.badge-2 { background:#d1fae5; color:#047857; } /* 已归还 */
.badge-3 { background:#fee2e2; color:#b91c1c; } /* 逾期 */
.badge-on { background:#d1fae5; color:#047857; }
.badge-off { background:#f3f4f6; color:#6b7280; }

/* 分页 */
.pagination { display:flex; gap:6px; justify-content:center; margin-top:20px; align-items:center; }
.pagination a, .pagination span {
    padding:6px 12px; border:1px solid #e5e7eb; border-radius:8px; font-size:13px; background:#fff; color:#374151;
}
.pagination .cur { background:#2563eb; color:#fff; border-color:#2563eb; }
.pagination .disabled { color:#cbd5e1; }

/* 表单 */
.form-row { margin-bottom:16px; }
.form-row label { display:block; font-size:13px; color:#4b5563; margin-bottom:6px; font-weight:600; }
.form-row input, .form-row select, .form-row textarea {
    width:100%; padding:9px 12px; border:1px solid #d1d5db; border-radius:8px; font-size:14px;
}
.form-row textarea { min-height:80px; resize:vertical; }

/* 登录/注册居中卡片 */
.auth-wrap { min-height:100vh; display:flex; align-items:center; justify-content:center;
             background:linear-gradient(160deg,#1e293b,#0f172a); }
.auth-card { background:#fff; width:380px; border-radius:16px; padding:36px 32px; box-shadow:0 20px 50px rgba(0,0,0,.3); }
.auth-card h1 { font-size:22px; text-align:center; margin-bottom:6px; }
.auth-card .sub { text-align:center; color:#9ca3af; font-size:13px; margin-bottom:24px; }

/* 提示消息 */
.alert { padding:10px 14px; border-radius:8px; margin-bottom:14px; font-size:14px; }
.alert-ok { background:#d1fae5; color:#065f46; }
.alert-err { background:#fee2e2; color:#991b1b; }

/* 统计卡片 */
.stat-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-bottom:24px; }
.stat-cards .sc { background:#fff; border-radius:12px; padding:22px; box-shadow:0 1px 4px rgba(15,23,42,.06); }
.stat-cards .sc .n { font-size:32px; font-weight:900; }
.stat-cards .sc .l { color:#6b7280; font-size:14px; margin-top:4px; }
.muted { color:#9ca3af; font-size:13px; }