/* 后台管理样式 */
* { box-sizing: border-box; margin: 0; padding: 0; }

body {
    font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
    background: #f0f2f5; color: #333; font-size: 14px;
}

/* 顶栏 */
.topbar {
    display: flex; align-items: center; justify-content: space-between;
    background: #2c3e50; color: #fff; padding: 0 28px; height: 54px;
    position: sticky; top: 0; z-index: 10;
}
.topbar .brand { font-size: 16px; font-weight: bold; }
.topbar nav a { color: #b8c2cc; text-decoration: none; margin-left: 20px; padding: 6px 2px; }
.topbar nav a:hover, .topbar nav a.active { color: #fff; border-bottom: 2px solid #4c8dff; }

/* 容器 */
.container { max-width: 95%; margin: 22px auto; padding: 0 18px; }
.container.wide { max-width: 98%; }
.card { background: #fff; border-radius: 10px; padding: 22px; box-shadow: 0 1px 6px rgba(0,0,0,.06); margin-bottom: 20px; }
.card h2 { font-size: 17px; margin-bottom: 14px; }
.card h3 { font-size: 15px; margin: 18px 0 10px; }
.toolbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; gap: 10px; flex-wrap: wrap; }

/* 表格 */
.table-wrap { overflow-x: auto; }
.table { width: 100%; border-collapse: collapse; }
#fieldsTable { min-width: 1350px; }
#rulesTable { min-width: 1500px; }
.table th, .table td { border: 1px solid #e3e7ec; padding: 8px 10px; text-align: center; font-size: 13px; }
.table th { background: #f5f7fa; color: #555; font-weight: 600; white-space: nowrap; }
.table tbody tr:nth-child(even) { background: #fafbfc; }
.table input, .table select, .table textarea {
    width: 100%; padding: 5px 7px; border: 1px solid #d5dbe3; border-radius: 4px; font-size: 13px;
}
.table textarea { resize: vertical; min-height: 48px; font-family: inherit; }
.table input:focus, .table select:focus, .table textarea:focus { border-color: #2f6fed; outline: none; }

/* 表单 */
.form-row { margin-bottom: 14px; }
.form-row label { display: block; margin-bottom: 5px; color: #444; font-size: 13px; }
.form-row input, .form-row select, .form-row textarea {
    width: 100%; padding: 8px 10px; border: 1px solid #d5dbe3; border-radius: 6px; font-size: 14px; outline: none;
}
.form-row input:focus, .form-row select:focus, .form-row textarea:focus { border-color: #2f6fed; }
.form-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 0 18px; }
.inline-check { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; white-space: nowrap; }
.inline-check input { width: auto; }

/* 按钮 */
.btn {
    display: inline-block; padding: 8px 20px; border: 1px solid #d5dbe3; border-radius: 6px;
    background: #fff; cursor: pointer; font-size: 14px; color: #444; text-decoration: none;
}
.btn:hover { border-color: #9db9e8; }
.btn-primary { background: #2f6fed; border-color: #2f6fed; color: #fff; }
.btn-primary:hover { background: #1f5cd8; }
.btn-danger { color: #c0392b; }
.btn-danger:hover { border-color: #e6b0aa; }
.btn-sm { padding: 4px 12px; font-size: 13px; }
.btn-block { width: 100%; }

/* 提示 */
.msg-ok { color: #1a7f37; background: #f0fff4; border: 1px solid #b7ebc4; padding: 10px 14px; border-radius: 6px; margin-bottom: 14px; }
.msg-err { color: #b42318; background: #fff5f4; border: 1px solid #f5c6c2; padding: 10px 14px; border-radius: 6px; margin-bottom: 14px; }
.tip { color: #888; font-size: 12px; line-height: 1.8; background: #f8f9fb; border: 1px dashed #d5dbe3; border-radius: 6px; padding: 10px 14px; margin-top: 12px; }
.tip code { background: #eef2f7; padding: 1px 6px; border-radius: 4px; color: #c0392b; }
.tag { display: inline-block; background: #eef4ff; color: #2f6fed; border-radius: 12px; padding: 2px 10px; font-size: 12px; }
.tag.off { background: #f2f2f2; color: #999; }

/* 登录页 */
.login-body { display: flex; justify-content: center; align-items: center; min-height: 100vh; background: #2c3e50; }
.login-box { background: #fff; border-radius: 10px; padding: 40px 46px; width: 380px; box-shadow: 0 8px 30px rgba(0,0,0,.25); }
.login-box h1 { font-size: 20px; text-align: center; }
.login-box .sub { text-align: center; color: #999; font-size: 13px; margin: 6px 0 22px; }
.login-box .back { text-align: center; margin-top: 18px; font-size: 13px; }
.login-box .back a { color: #2f6fed; text-decoration: none; }