/* ============ FormPro 管理后台 全局样式（深蓝专业风格） ============ */
:root {
  --navy-900:#0b1e3f; --navy-800:#12294f; --navy-700:#1a3563;
  --blue-600:#2563eb; --blue-500:#3b82f6; --blue-400:#60a5fa; --blue-100:#dbeafe;
  --bg:#f0f4f9; --card:#ffffff; --line:#e3e9f2;
  --text:#1f2d3d; --text-2:#5e6d82; --text-3:#90a0b7;
  --green:#10b981; --red:#ef4444; --orange:#f59e0b; --radius:10px;
  --shadow:0 2px 12px rgba(16,42,88,.08); --shadow-lg:0 8px 30px rgba(16,42,88,.14);
  --grad:linear-gradient(135deg,#2563eb 0%,#1d4ed8 55%,#1e3a8a 100%);
}
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:-apple-system,"PingFang SC","Microsoft YaHei",sans-serif; background:var(--bg); color:var(--text); font-size:14px; }
a { color:var(--blue-600); text-decoration:none; }
::-webkit-scrollbar { width:6px; height:6px; } ::-webkit-scrollbar-thumb { background:#c3cede; border-radius:3px; }

/* 布局 */
.layout { display:flex; min-height:100vh; }
.sidebar { width:220px; background:linear-gradient(180deg,var(--navy-900) 0%,var(--navy-800) 100%); color:#cdd8ec; position:fixed; top:0; bottom:0; left:0; z-index:100; display:flex; flex-direction:column; }
.logo { display:flex; align-items:center; gap:10px; padding:20px 22px 18px; }
.logo .mark { width:34px; height:34px; border-radius:9px; background:var(--grad); display:flex; align-items:center; justify-content:center; color:#fff; font-weight:800; font-size:16px; box-shadow:0 4px 12px rgba(37,99,235,.45); }
.logo b { color:#fff; font-size:17px; letter-spacing:.5px; }
.menu { flex:1; padding:6px 12px; overflow-y:auto; }
.menu a { display:flex; align-items:center; gap:10px; padding:11px 14px; margin:3px 0; border-radius:8px; color:#aebbd6; font-size:14px; transition:all .18s; }
.menu a .ic { width:18px; text-align:center; font-style:normal; opacity:.9; }
.menu a:hover { background:rgba(255,255,255,.07); color:#fff; }
.menu a.on { background:var(--grad); color:#fff; box-shadow:0 4px 14px rgba(37,99,235,.4); }
.side-foot { padding:14px 20px; border-top:1px solid rgba(255,255,255,.08); font-size:12px; color:#7e8db0; }
.main { flex:1; margin-left:220px; display:flex; flex-direction:column; min-width:0; }
.topbar { height:58px; background:var(--card); border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; padding:0 24px; position:sticky; top:0; z-index:90; }
.topbar .crumb { font-size:16px; font-weight:600; }
.userbox { display:flex; align-items:center; gap:14px; font-size:13px; color:var(--text-2); }
.avatar { width:32px; height:32px; border-radius:50%; background:var(--grad); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:13px; }
.content { padding:22px 24px; flex:1; }

/* 卡片/面板 */
.card { background:var(--card); border-radius:var(--radius); box-shadow:var(--shadow); padding:20px; margin-bottom:18px; }
.card h3 { font-size:15px; margin-bottom:14px; display:flex; align-items:center; gap:8px; }
.card h3::before { content:""; width:4px; height:15px; border-radius:2px; background:var(--grad); }
.row { display:flex; gap:16px; flex-wrap:wrap; }
.grid-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
@media (max-width:1100px){ .grid-4 { grid-template-columns:repeat(2,1fr); } }

/* 统计卡 */
.stat { background:var(--card); border-radius:var(--radius); box-shadow:var(--shadow); padding:18px 20px; display:flex; align-items:center; gap:16px; transition:transform .2s, box-shadow .2s; }
.stat:hover { transform:translateY(-3px); box-shadow:var(--shadow-lg); }
.stat .ic { width:48px; height:48px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:22px; color:#fff; background:var(--grad); }
.stat .ic.g { background:linear-gradient(135deg,#10b981,#059669); }
.stat .ic.o { background:linear-gradient(135deg,#f59e0b,#d97706); }
.stat .ic.p { background:linear-gradient(135deg,#8b5cf6,#7c3aed); }
.stat b { font-size:24px; display:block; }
.stat span { color:var(--text-2); font-size:12px; }

/* 按钮 */
.btn { display:inline-flex; align-items:center; gap:6px; padding:8px 16px; border-radius:8px; border:1px solid var(--line); background:#fff; color:var(--text); cursor:pointer; font-size:13px; transition:all .18s; user-select:none; }
.btn:hover { border-color:var(--blue-400); color:var(--blue-600); }
.btn.pri { background:var(--grad); border:none; color:#fff; box-shadow:0 3px 10px rgba(37,99,235,.35); }
.btn.pri:hover { opacity:.9; color:#fff; }
.btn.warn { background:#fff7ed; border-color:#fed7aa; color:#c2410c; }
.btn.danger { background:#fef2f2; border-color:#fecaca; color:#dc2626; }
.btn.sm { padding:4px 10px; font-size:12px; border-radius:6px; }
.btn:disabled { opacity:.5; cursor:not-allowed; }

/* 表格 */
table.tbl { width:100%; border-collapse:collapse; }
.tbl th { text-align:left; padding:11px 12px; background:#f6f9fd; color:var(--text-2); font-weight:500; font-size:12px; border-bottom:1px solid var(--line); white-space:nowrap; }
.tbl td { padding:12px; border-bottom:1px solid #eef2f8; font-size:13px; }
.tbl tr:hover td { background:#f8fbff; }
.tag { display:inline-block; padding:2px 9px; border-radius:20px; font-size:12px; }
.tag.g { background:#ecfdf5; color:#059669; } .tag.r { background:#fef2f2; color:#dc2626; }
.tag.o { background:#fffbeb; color:#d97706; } .tag.b { background:#eff6ff; color:#2563eb; }
.tag.p { background:#f5f3ff; color:#7c3aed; }

/* 表单控件 */
.ipt, .sel, .ta { width:100%; padding:9px 12px; border:1px solid var(--line); border-radius:8px; font-size:13px; outline:none; transition:border .18s, box-shadow .18s; background:#fff; color:var(--text); font-family:inherit; }
.ipt:focus, .sel:focus, .ta:focus { border-color:var(--blue-500); box-shadow:0 0 0 3px rgba(59,130,246,.15); }
.ta { min-height:70px; resize:vertical; }
.field { margin-bottom:14px; }
.field > label { display:block; font-size:12px; color:var(--text-2); margin-bottom:6px; }
.searchbar { display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-bottom:14px; }
.searchbar .ipt, .searchbar .sel { width:auto; min-width:150px; }
.checkbox, .radio { accent-color:var(--blue-600); }

/* 分页 */
.pager { display:flex; align-items:center; justify-content:flex-end; gap:8px; margin-top:14px; font-size:13px; color:var(--text-2); }
.pager button { padding:5px 11px; border:1px solid var(--line); background:#fff; border-radius:6px; cursor:pointer; }
.pager button.on { background:var(--grad); color:#fff; border:none; }
.pager button:disabled { opacity:.4; cursor:not-allowed; }

/* 弹窗 */
.mask { position:fixed; inset:0; background:rgba(10,25,55,.45); z-index:200; display:none; align-items:center; justify-content:center; backdrop-filter:blur(2px); }
.mask.show { display:flex; }
.modal { background:#fff; border-radius:14px; width:min(680px,92vw); max-height:88vh; display:flex; flex-direction:column; box-shadow:var(--shadow-lg); animation:pop .2s ease; }
@keyframes pop { from { transform:scale(.94); opacity:0; } }
.modal .m-hd { padding:16px 20px; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; font-weight:600; }
.modal .m-hd .x { cursor:pointer; color:var(--text-3); font-size:18px; padding:0 4px; }
.modal .m-bd { padding:20px; overflow-y:auto; }
.modal .m-ft { padding:14px 20px; border-top:1px solid var(--line); display:flex; justify-content:flex-end; gap:10px; }
.modal.wide { width:min(960px,94vw); }

/* Toast */
#toast { position:fixed; top:70px; left:50%; transform:translateX(-50%); z-index:999; padding:10px 22px; border-radius:24px; color:#fff; font-size:13px; display:none; box-shadow:var(--shadow-lg); }
#toast.ok { background:#10b981; } #toast.err { background:#ef4444; }

/* 登录页 */
.login-page { min-height:100vh; background:radial-gradient(1200px 600px at 70% -10%,#1e3a8a 0%,#0b1e3f 55%,#060f22 100%); display:flex; align-items:center; justify-content:center; }
.login-box { width:400px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); backdrop-filter:blur(16px); border-radius:18px; padding:40px 36px; color:#fff; }
.login-box h1 { font-size:22px; margin-bottom:6px; }
.login-box p { color:#9fb2d8; font-size:13px; margin-bottom:28px; }
.login-box .ipt { background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.15); color:#fff; margin-bottom:14px; }
.login-box .ipt::placeholder { color:#7d8fb5; }
.login-box .btn { width:100%; justify-content:center; padding:12px; font-size:15px; }
.login-logo { width:52px; height:52px; border-radius:14px; background:var(--grad); display:flex; align-items:center; justify-content:center; font-weight:800; font-size:22px; margin-bottom:18px; box-shadow:0 8px 24px rgba(37,99,235,.5); }

/* 图表 */
.chart-tip { position:absolute; background:#0b1e3f; color:#fff; padding:4px 10px; border-radius:6px; font-size:12px; pointer-events:none; display:none; z-index:10; white-space:nowrap; }

/* 空状态 */
.empty { text-align:center; color:var(--text-3); padding:46px 0; font-size:13px; }
.empty .big { font-size:38px; margin-bottom:8px; opacity:.5; }

/* ================= 表单编辑器 editor.php ================= */
.ed-top{display:flex;align-items:center;gap:8px;margin-bottom:12px;flex-wrap:wrap}
.ed-top .ipt{max-width:260px}
.ed-wrap{display:flex;gap:12px;height:calc(100vh - 150px);min-height:520px}
.ed-left{width:232px;flex:none;background:#fff;border-radius:10px;padding:10px 12px;overflow-y:auto;box-shadow:0 1px 4px rgba(15,43,82,.06)}
.ed-group-t{font-size:12px;color:#5e6d82;font-weight:600;margin:12px 2px 6px}
.ed-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.ed-item{display:flex;flex-direction:column;align-items:center;gap:4px;padding:9px 2px;border:1px solid #e6ecf5;border-radius:8px;font-size:12px;color:#33475b;cursor:grab;background:#f8fafd;user-select:none;text-align:center}
.ed-item:hover{border-color:#2563eb;color:#2563eb;background:#eef4ff}
.ed-item .ic{font-size:16px}
.ed-canvas-wrap{flex:1;overflow-y:auto;background:linear-gradient(180deg,#eef2f8,#e3eaf4);border-radius:10px;padding:18px;display:flex;justify-content:center;align-items:flex-start}
.ed-canvas{width:720px;max-width:100%;background:#fff;border-radius:12px;min-height:420px;padding:18px;box-shadow:0 4px 18px rgba(15,43,82,.10)}
.ed-canvas.mobile{width:375px;border-radius:26px;border:7px solid #16233c;padding:14px}
.ed-blk{position:relative;border:1px solid transparent;border-radius:8px;padding:8px 10px;margin-bottom:8px;cursor:pointer}
.ed-blk:hover{border-color:#c3d4f5;background:#f8faff}
.ed-blk.sel{border-color:#2563eb;background:#f2f7ff;box-shadow:0 0 0 2px rgba(37,99,235,.12)}
.ed-blk-hd{display:flex;align-items:center;gap:6px;font-size:13px;color:#33475b;margin-bottom:6px}
.ed-blk-hd b{font-weight:600}
.ed-blk-hd .req{color:#e5484d}
.ed-blk-hd .tp{font-size:11px;color:#90a0b7;background:#f1f5fb;border-radius:4px;padding:1px 6px;font-weight:400}
.ed-tools{position:absolute;top:6px;right:8px;display:none;gap:4px;z-index:3}
.ed-blk:hover .ed-tools,.ed-blk.sel .ed-tools{display:flex}
.ed-tools button{border:none;background:#fff;border:1px solid #dbe4f0;border-radius:6px;width:24px;height:24px;cursor:pointer;font-size:12px;color:#5e6d82}
.ed-tools button:hover{color:#2563eb;border-color:#2563eb}
.ed-child{border:1px dashed #dbe4f0;border-radius:6px;padding:6px 8px;margin-bottom:6px;display:flex;align-items:center;gap:6px;font-size:12px;color:#5e6d82;background:#fff}
.ed-fake{background:#f6f8fc;border:1px solid #e6ecf5;border-radius:6px;padding:8px 10px;color:#a8b4c4;font-size:13px}
.ed-ph{height:3px;background:#2563eb;border-radius:2px;margin:2px 0}
.ed-props{width:320px;flex:none;background:#fff;border-radius:10px;padding:14px;overflow-y:auto;box-shadow:0 1px 4px rgba(15,43,82,.06)}
.ed-fld{margin-bottom:12px}
.ed-fld>label{display:block;font-size:12px;color:#5e6d82;margin-bottom:5px}
.ed-fld .ipt,.ed-fld select{width:100%;font-size:13px}
.ed-fld textarea{width:100%;min-height:64px;border:1px solid #dbe4f0;border-radius:6px;padding:8px;font-size:13px;color:#33475b;resize:vertical;font-family:inherit}
.ed-sec{font-size:12px;color:#2563eb;font-weight:600;border-top:1px dashed #e6ecf5;padding-top:12px;margin:14px 0 10px}
.ed-chk{display:flex;align-items:center;gap:6px;font-size:13px;color:#33475b;cursor:pointer}
.ed-goods{border:1px solid #e6ecf5;border-radius:8px;padding:8px;margin-bottom:8px;background:#f8fafd}
.ed-goods .spec{display:flex;gap:4px;margin:4px 0;align-items:center}
.ed-canvas.preview .ed-tools{display:none!important}
.ed-canvas.preview .ed-blk{cursor:default}
.ed-canvas.preview .ed-blk:hover{border-color:transparent;background:transparent}
.ed-btn-demo{display:inline-block;background:linear-gradient(135deg,#2563eb,#4f8cff);color:#fff;border-radius:8px;padding:9px 26px;font-size:14px}
.ed-mode-bar{display:flex;gap:6px;align-items:center}
.btn.on{background:#2563eb;color:#fff;border-color:#2563eb}