* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: -apple-system, "Microsoft YaHei", sans-serif; background: #f5f6fa; color: #2c3e50; }
.topbar { background: #1e3a5f; color: #fff; padding: 0 24px; display: flex; align-items: center; height: 56px; position: sticky; top:0; z-index: 100; }
.logo { font-weight: 700; font-size: 18px; margin-right: 32px; white-space: nowrap; }
#nav { display: flex; gap: 4px; flex: 1; overflow-x: auto; }
#nav a { color: #c8d6e5; padding: 18px 14px; cursor: pointer; font-size: 14px; white-space: nowrap; border-bottom: 3px solid transparent; }
#nav a:hover { color: #fff; }
#nav a.active { color: #fff; border-bottom-color: #4ea1ff; }
main { padding: 24px; max-width: 1200px; margin: 0 auto; }
.loading { text-align: center; padding: 60px; color: #888; }
.card { background: #fff; border-radius: 10px; padding: 20px; box-shadow: 0 2px 8px rgba(0,0,0,.06); margin-bottom: 20px; }
h2 { font-size: 18px; margin-bottom: 16px; color: #1e3a5f; }
h3 { font-size: 15px; margin: 16px 0 10px; color: #444; }
.row { display: flex; gap: 12px; flex-wrap: wrap; }
.field { display: flex; flex-direction: column; gap: 4px; margin-bottom: 12px; }
.field label { font-size: 12px; color: #666; }
input, select, textarea { padding: 9px 10px; border: 1px solid #dcdfe6; border-radius: 6px; font-size: 14px; font-family: inherit; height: 40px; line-height: 1; }
input:focus, select:focus { outline: none; border-color: #4ea1ff; }
button { background: #4ea1ff; color: #fff; border: none; padding: 0 18px; border-radius: 6px; cursor: pointer; font-size: 14px; height: 40px; line-height: 1; display: inline-flex; align-items: center; justify-content: center; }
button:hover { background: #3b8ae6; }
.row > button { align-self: flex-end; margin-bottom: 12px; }
button.ghost { background: #eee; color: #555; }
button.danger { background: #ff6b6b; }
table { width: 100%; border-collapse: collapse; font-size: 13px; }
th, td { padding: 10px 12px; text-align: left; border-bottom: 1px solid #eee; }
th { background: #f8f9fb; color: #666; font-weight: 600; }
tr:hover td { background: #fafbfc; }
.stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px,1fr)); gap: 16px; }
.stat { background: linear-gradient(135deg,#4ea1ff,#1e3a5f); color:#fff; border-radius: 10px; padding: 20px; }
.stat .num { font-size: 28px; font-weight: 700; }
.stat .lbl { font-size: 13px; opacity: .85; margin-top: 4px; }
.tabs { display: flex; gap:8px; margin-bottom: 16px; }
.tabs button { background:#eee; color:#555; }
.tabs button.active { background:#4ea1ff; color:#fff; }
.item-row { display:flex; gap:8px; align-items:center; margin-bottom:8px; padding:8px; background:#f8f9fb; border-radius:6px; }
.item-row input { flex:1; min-width: 80px; }
.muted { color:#999; font-size:12px; }
.tag { display:inline-block; padding:2px 8px; border-radius:10px; font-size:11px; background:#e8f3ff; color:#1e3a5f; }
.tag.tiktok { background:#ffe8f0; color:#d6336c; }
.tag.amazon { background:#fff3cd; color:#b8860b; }
.toast { position: fixed; bottom: 30px; left: 50%; transform: translateX(-50%); background: #2c3e50; color:#fff; padding: 12px 24px; border-radius: 8px; z-index: 999; opacity: 0; transition: .3s; }
.toast.show { opacity: 1; }
.toast.err { background: #e74c3c; }
.search-bar { display:flex; gap:8px; margin-bottom:16px; }
.search-bar input { flex:1; }

.tag.closed{background:#27ae60;color:#fff}
.tag.open{background:#e67e22;color:#fff}
.muted{color:#95a5a6;font-size:13px}

/* 顶部账号菜单按钮统一风格 */
.user-menu { display:flex; align-items:center; gap:8px; margin-left:auto; }
.user-menu .user-name { font-size:13px; color:#333; white-space:nowrap; max-width:180px; overflow:hidden; text-overflow:ellipsis; }
.user-menu button { background:#4ea1ff; color:#fff; border:none; padding:0 14px; border-radius:6px; font-size:13px; cursor:pointer; height:34px; display:inline-flex; align-items:center; justify-content:center; }
.user-menu button:hover { background:#3b8ae6; }

/* 弹窗右上角关闭按钮 */
.modal { position: relative; }
.modal-close { position:absolute; top:12px; right:12px; width:32px; height:32px; border-radius:50%; border:none; background:#eee; color:#555; font-size:20px; line-height:1; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; }
.modal-close:hover { background:#ddd; color:#333; }
.btn-text { background:transparent !important; color:#4ea1ff !important; border:none !important; padding:0 6px !important; height:auto !important; font-size:14px !important; }
.btn-text:hover { background:transparent !important; color:#3b8ae6 !important; }

/* 销售订单状态标签 */
.st{display:inline-block;padding:2px 9px;border-radius:10px;font-size:11px;font-weight:600;background:#eee;color:#555;white-space:nowrap}
.st-pending{background:#fff7e6;color:#d46b08}
.st-paid{background:#e6f7ff;color:#1677ff}
.st-toship{background:#e8f3ff;color:#1e3a5f}
.st-shipped{background:#f9f0ff;color:#722ed1}
.st-done{background:#e8f8ee;color:#27ae60}
.st-cancel{background:#fde8e8;color:#c0392b}
