/* 管理端（9780）界面样式 —— 参考 ACSystem acs-server 设计语言（明亮卡片 + 圆角 + 胶囊 tab）
   所有规则限定在 body[data-mode="admin"] 作用域内，不影响用户端（9700）深色主题。 */

body[data-mode="admin"] {
  --bg: #f5f5f7;
  --card: #ffffff;
  --text: #1d1d1f;
  --mut: #6e6e73;
  --line: #d2d2d7;
  --blue: #3aa0ff;
  --blue-d: #1f8af0;
  --green: #1d7a4d;
  --red: #c72e2e;
  --shadow: 0 8px 30px rgba(0, 0, 0, .08);
}

body[data-mode="admin"] {
  background: var(--bg);
  color: var(--text);
  -webkit-font-smoothing: antialiased;
}

body[data-mode="admin"] h1, body[data-mode="admin"] h2, body[data-mode="admin"] h3 { font-weight: 600; color: var(--text); }
body[data-mode="admin"] a { color: var(--blue); text-decoration: none; }
body[data-mode="admin"] .muted { color: var(--mut); font-size: 12px; }
body[data-mode="admin"] .hint { color: var(--mut); font-size: 12px; font-weight: 400; }
body[data-mode="admin"] .mono { font-family: "SF Mono", Consolas, monospace; font-size: 12px; word-break: break-all; }
body[data-mode="admin"] .hidden { display: none !important; }

/* ---------- 隐藏用户端顶栏，启用管理端顶栏 ---------- */
body[data-mode="admin"] header.topbar { display: none; }
.admin-topbar { display: none; }
body[data-mode="admin"] header.admin-topbar {
  display: block;
  position: sticky; top: 0; z-index: 20;
  background: rgba(255, 255, 255, .85);
  backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--line);
}
body[data-mode="admin"] .admin-topbar .bar {
  max-width: 1180px; margin: 0 auto; padding: 12px 24px;
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
}
body[data-mode="admin"] .admin-topbar .brand {
  display: flex; align-items: center; gap: 10px;
  font-weight: 700; font-size: 16px; color: var(--text); white-space: nowrap;
}
body[data-mode="admin"] .admin-topbar .brand .logo {
  width: 30px; height: 30px; display: flex; align-items: center; justify-content: center;
  border-radius: 8px; background: linear-gradient(135deg, #4f6cff, #1bc9ff);
  color: #fff; font-weight: 800; font-size: 15px; letter-spacing: -.5px;
}
body[data-mode="admin"] .admin-topbar .admin-nav { display: flex; gap: 4px; margin-left: 6px; flex-wrap: wrap; }
body[data-mode="admin"] .admin-topbar .admin-nav a {
  padding: 6px 12px; border-radius: 980px; font-size: 13px;
  text-decoration: none; color: var(--mut); font-weight: 600; white-space: nowrap;
}
body[data-mode="admin"] .admin-topbar .admin-nav a:hover { background: rgba(0, 113, 227, .08); color: var(--blue); }
body[data-mode="admin"] .admin-topbar .admin-nav a.active { background: var(--blue); color: #fff; }
body[data-mode="admin"] .admin-topbar .sp { flex: 1; }
body[data-mode="admin"] .admin-topbar .who { font-size: 13px; color: var(--mut); white-space: nowrap; }
body[data-mode="admin"] .link-btn {
  background: none; color: var(--blue); padding: 6px 10px; border: none;
  border-radius: 980px; font-size: 14px; font-weight: 600; cursor: pointer;
}
body[data-mode="admin"] .link-btn:hover { background: rgba(0, 113, 227, .08); }

/* ---------- 布局 ---------- */
body[data-mode="admin"] .layout { max-width: 1180px; margin: 0 auto; padding: 20px 24px 60px; }
body[data-mode="admin"] .sections { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px; }
body[data-mode="admin"] .section-tab {
  padding: 8px 16px; border-radius: 980px; font-size: 13px;
  background: rgba(0, 0, 0, .04); color: var(--mut); cursor: pointer;
  border: 1px solid transparent; user-select: none;
}
body[data-mode="admin"] .section-tab.on { background: var(--blue); color: #fff; }
body[data-mode="admin"] .section { display: none; }
body[data-mode="admin"] .section.on { display: block; }

/* ---------- 卡片 / 面板 ---------- */
body[data-mode="admin"] .cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; margin-bottom: 20px; }
body[data-mode="admin"] .card {
  background: var(--card); border: 1px solid var(--line); border-radius: 18px;
  padding: 20px; box-shadow: var(--shadow);
}
body[data-mode="admin"] .card .k { font-size: 12px; color: var(--mut); }
body[data-mode="admin"] .card .v { font-size: 26px; font-weight: 700; margin-top: 8px; }
body[data-mode="admin"] .panel {
  background: var(--card); border: 1px solid var(--line); border-radius: 18px;
  padding: 22px; margin-bottom: 18px; box-shadow: var(--shadow);
}
body[data-mode="admin"] .panel > h2 {
  font-size: 17px; margin-bottom: 16px; padding-bottom: 10px; border-bottom: 1px solid var(--line); color: var(--text);
}
body[data-mode="admin"] .panel > h3, body[data-mode="admin"] .card > h3 { font-size: 14px; margin: 12px 0 6px; color: var(--text); }
body[data-mode="admin"] .row { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-bottom: 12px; }
body[data-mode="admin"] .kv { display: flex; flex-direction: column; gap: 8px; font-size: 13.5px; }
body[data-mode="admin"] .kv .muted { font-size: 12px; }

/* ---------- 表单 ---------- */
body[data-mode="admin"] input, body[data-mode="admin"] select, body[data-mode="admin"] textarea {
  width: 100%; padding: 10px 14px; border: 1px solid var(--line); border-radius: 10px;
  background: #fff; font-size: 14px; outline: none; transition: border-color .15s, box-shadow .15s; color: var(--text);
}
body[data-mode="admin"] input:focus, body[data-mode="admin"] select:focus, body[data-mode="admin"] textarea:focus {
  border-color: var(--blue); box-shadow: 0 0 0 3px rgba(0, 113, 227, .15);
}
body[data-mode="admin"] .row input, body[data-mode="admin"] .row select { width: auto; }
body[data-mode="admin"] .form { display: flex; flex-direction: column; gap: 8px; margin: 8px 0; }
body[data-mode="admin"] .form label { display: flex; flex-direction: column; font-size: 13px; color: var(--mut); gap: 4px; }
body[data-mode="admin"] .form.inline { flex-direction: row; flex-wrap: wrap; align-items: center; }
body[data-mode="admin"] .form.inline input, body[data-mode="admin"] .form.inline select { width: auto; }

/* ---------- 按钮 ---------- */
body[data-mode="admin"] button {
  cursor: pointer; border: none; border-radius: 980px; padding: 10px 20px;
  font-size: 14px; font-weight: 600; transition: all .15s; background: var(--blue); color: #fff;
}
body[data-mode="admin"] button:hover { filter: brightness(1.05); }
body[data-mode="admin"] .btn-primary { background: var(--blue); color: #fff; }
body[data-mode="admin"] .btn-primary:hover { background: var(--blue-d); }
body[data-mode="admin"] .btn-secondary { background: #e8e8ed; color: var(--text); }
body[data-mode="admin"] .btn-secondary:hover { background: #d9d9df; }
body[data-mode="admin"] .btn-danger { background: #fbe9e9; color: var(--red); }
body[data-mode="admin"] .btn-success { background: #e6f4ea; color: var(--green); }
body[data-mode="admin"] .btn-sm { padding: 6px 12px; font-size: 12px; }
body[data-mode="admin"] button.ghost { background: #e8e8ed; color: var(--text); }
body[data-mode="admin"] button.ghost:hover { background: #d9d9df; }
body[data-mode="admin"] button.danger { background: #fbe9e9; color: var(--red); }
body[data-mode="admin"] button.danger:hover { filter: brightness(.98); }
body[data-mode="admin"] button.ok { background: #e6f4ea; color: var(--green); }
body[data-mode="admin"] .actions { display: flex; gap: 6px; flex-wrap: wrap; }
body[data-mode="admin"] .actions button { padding: 4px 12px; font-size: 12px; }

/* ---------- 表格 ---------- */
body[data-mode="admin"] table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
body[data-mode="admin"] th { color: var(--mut); font-weight: 600; text-align: left; padding: 10px; border-bottom: 1px solid var(--line); white-space: nowrap; }
body[data-mode="admin"] td { padding: 10px; border-bottom: 1px solid rgba(210, 210, 215, .5); vertical-align: top; }
body[data-mode="admin"] tr:hover td { background: #fafafa; }

/* ---------- 状态胶囊（.badge 由 app.js 渲染） ---------- */
body[data-mode="admin"] .badge {
  display: inline-block; padding: 3px 10px; border-radius: 980px; font-size: 12px; font-weight: 600;
}
body[data-mode="admin"] .badge.active, body[data-mode="admin"] .badge.Active,
body[data-mode="admin"] .badge.Listed, body[data-mode="admin"] .badge.Approved,
body[data-mode="admin"] .badge.Confirmed, body[data-mode="admin"] .badge.Done { background: #e6f4ea; color: var(--green); }
body[data-mode="admin"] .badge.frozen, body[data-mode="admin"] .badge.Frozen,
body[data-mode="admin"] .badge.Suspended { background: #fdf3e3; color: #9a5b00; }
body[data-mode="admin"] .badge.deleted, body[data-mode="admin"] .badge.Deleted,
body[data-mode="admin"] .badge.Rejected, body[data-mode="admin"] .badge.Delisted { background: #fbe9e9; color: var(--red); }
body[data-mode="admin"] .badge.Pending, body[data-mode="admin"] .badge.Queried,
body[data-mode="admin"] .badge.Processing { background: #e8f0fe; color: #1a56a0; }

/* ---------- 消息 ---------- */
body[data-mode="admin"] .msg { color: var(--red); font-size: 13px; min-height: 16px; margin-top: 8px; }
body[data-mode="admin"] .msg.err { color: var(--red); }
body[data-mode="admin"] .msg.ok, body[data-mode="admin"] .okmsg { color: var(--green); font-size: 13px; margin-top: 8px; }

/* ---------- 登录页（管理端亮色化） ---------- */
body[data-mode="admin"] .auth-card { max-width: 420px; margin: 40px auto; }
body[data-mode="admin"] #view-auth .card {
  background: var(--card); border: 1px solid var(--line); border-radius: 18px;
  padding: 22px; box-shadow: var(--shadow);
}
body[data-mode="admin"] #view-auth .card h2 { color: var(--text); border-bottom: 1px solid var(--line); padding-bottom: 10px; }
body[data-mode="admin"] #view-auth input, body[data-mode="admin"] #view-auth select { background: #fff; }

/* ---------- 模态框 ---------- */
body[data-mode="admin"] .modal { position: fixed; inset: 0; background: rgba(0, 0, 0, .5); display: flex; align-items: center; justify-content: center; z-index: 100; }
body[data-mode="admin"] .modal-box { max-width: 440px; width: 90%; background: var(--card); border: 1px solid var(--line); border-radius: 18px; padding: 24px; box-shadow: var(--shadow); }
body[data-mode="admin"] .modal-box h2 { color: var(--text); border-bottom: 1px solid var(--line); padding-bottom: 10px; margin-bottom: 14px; }
body[data-mode="admin"] .modal-box input { background: #fff; }

/* ---------- 其他辅助 ---------- */
body[data-mode="admin"] .grow { flex: 1 1 48%; }

/* ---------- 股票中心（管理端亮色覆盖） ---------- */
body[data-mode="admin"] .idx-card { background: var(--card); border: 1px solid var(--line); border-radius: 14px; }
body[data-mode="admin"] .stock-row { background: #fbfbfd; border: 1px solid var(--line); border-radius: 12px; }
body[data-mode="admin"] .stock-row:hover { border-color: var(--blue); }
body[data-mode="admin"] .chg.up { color: var(--green); }
body[data-mode="admin"] .chg.down { color: var(--red); }
body[data-mode="admin"] .stock-name { color: var(--text); }
body[data-mode="admin"] .s-del { background: #fbe9e9; color: var(--red); }
body[data-mode="admin"] #sd-canvas { background: #0c1220; } /* 详情图统一深色 */
