/* ===== Global ===== */
* { box-sizing: border-box; }
body { margin: 0; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif; background: #f0f2f5; }

/* ===== Login Page ===== */
.login-wrapper { display: flex; align-items: center; justify-content: center; min-height: 100vh; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); }
.login-card { width: 400px; padding: 40px; background: #fff; border-radius: 12px; box-shadow: 0 8px 24px rgba(0,0,0,.15); }
.login-title { text-align: center; font-size: 24px; font-weight: 600; color: #303133; margin-bottom: 30px; }

/* ===== Layout ===== */
.layout-container { min-height: 100vh; }
.sidebar { background: #304156; color: #fff; overflow-y: auto; }
.sidebar-logo { height: 60px; display: flex; align-items: center; justify-content: center; font-size: 18px; font-weight: 600; color: #fff; border-bottom: 1px solid #3d4a5a; }
.sidebar-logo span { margin-left: 8px; }
.el-menu { border-right: none !important; }
.el-menu--collapse .el-menu-item__title { display: none; }

.header { display: flex; justify-content: space-between; align-items: center; padding: 0 20px; background: #fff; box-shadow: 0 1px 4px rgba(0,0,0,.08); height: 60px; }
.header-left { font-size: 16px; font-weight: 500; color: #303133; }
.header-right { display: flex; align-items: center; gap: 12px; }

.content { padding: 20px; background: #f0f2f5; min-height: calc(100vh - 60px); }

/* ===== Page Header ===== */
.page-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.page-title { font-size: 18px; font-weight: 600; color: #303133; }

/* ===== Stat Cards ===== */
.stat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
.stat-card { padding: 20px; border-radius: 8px; color: #fff; }
.stat-card .stat-number { font-size: 32px; font-weight: 700; }
.stat-card .stat-label { font-size: 14px; opacity: .85; margin-top: 4px; }
.stat-blue { background: linear-gradient(135deg, #667eea, #764ba2); }
.stat-green { background: linear-gradient(135deg, #43e97b, #38f9d7); }
.stat-orange { background: linear-gradient(135deg, #fa709a, #fee140); }
.stat-cyan { background: linear-gradient(135deg, #4facfe, #00f2fe); }

/* ===== Search Bar ===== */
.search-bar { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 16px; }

/* ===== Table Card ===== */
.table-card { background: #fff; border-radius: 8px; padding: 16px; }
.pagination-wrapper { display: flex; justify-content: flex-end; margin-top: 16px; }

/* ===== Dialog ===== */
.dialog-footer { display: flex; justify-content: flex-end; gap: 10px; }

/* ===== Misc ===== */
.el-form-item { margin-bottom: 16px; }
.clickable { cursor: pointer; }
.clickable:hover { color: #409eff; }
.text-muted { color: #909399; }
.mt-10 { margin-top: 10px; }