/* 星枢AI 管理后台 admin.css v2 */
:root {
  --bg: #070d14;
  --panel: #0e1620;
  --panel2: #111c28;
  --line: rgba(255, 255, 255, .08);
  --txt: #e8edf2;
  --dim: #8b96a5;
  --cyan: #22d3ee;
  --purple: #8b5cf6;
  --green: #34d399;
  --red: #f87171;
  --amber: #fbbf24;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
body { background: var(--bg); color: var(--txt); font: 14px/1.6 -apple-system, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif; }
.hidden { display: none !important; }
a { color: var(--cyan); text-decoration: none; }
button { cursor: pointer; font-family: inherit; }
input, select, textarea { font-family: inherit; }

/* 登录 */
.adm-login { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: radial-gradient(900px 500px at 50% -10%, rgba(34,211,238,.14), transparent), var(--bg); }
.adm-login-card { width: 380px; max-width: 92vw; background: var(--panel); border: 1px solid var(--line); border-radius: 18px; padding: 32px 28px; display: flex; flex-direction: column; gap: 14px; box-shadow: 0 30px 80px rgba(0,0,0,.5); }
.adm-logo { display: flex; align-items: center; gap: 12px; }
.adm-logo span { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; font-weight: 800; color: #04121a; background: linear-gradient(135deg, var(--cyan), var(--purple)); font-size: 20px; }
.adm-logo strong { font-size: 17px; display: block; }
.adm-logo small { color: var(--dim); font-size: 12px; }
.adm-hint { color: var(--dim); font-size: 12.5px; }
.adm-login-card input { background: #0a121b; border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; color: var(--txt); font-size: 14px; outline: none; }
.adm-login-card input:focus { border-color: var(--cyan); }
.adm-back { text-align: center; font-size: 13px; color: var(--dim); }

/* 通用按钮 */
.adm-btn-primary { background: linear-gradient(135deg, var(--cyan), #0ea5b7); color: #04121a; border: none; border-radius: 10px; padding: 11px 18px; font-weight: 700; font-size: 14px; }
.adm-btn-primary:hover { filter: brightness(1.08); }
.adm-btn-ghost { background: transparent; color: var(--dim); border: 1px solid var(--line); border-radius: 9px; padding: 8px 14px; font-size: 13px; }
.adm-btn-ghost:hover { color: var(--txt); border-color: rgba(255,255,255,.2); }
.adm-sm { padding: 7px 13px !important; font-size: 13px !important; border-radius: 8px !important; }

/* 布局 */
.adm-shell { display: grid; grid-template-columns: 230px 1fr; min-height: 100vh; }
.adm-side { background: var(--panel); border-right: 1px solid var(--line); padding: 20px 14px; display: flex; flex-direction: column; gap: 6px; position: sticky; top: 0; height: 100vh; }
.adm-side .adm-logo { padding: 4px 8px 16px; }
.adm-side nav { display: flex; flex-direction: column; gap: 3px; flex: 1; overflow-y: auto; }
.adm-side nav button { position: relative; text-align: left; background: transparent; border: none; color: var(--dim); padding: 11px 14px; border-radius: 10px; font-size: 14px; transition: .15s; }
.adm-side nav button:hover { background: rgba(255,255,255,.04); color: var(--txt); }
.adm-side nav button.active { background: rgba(34,211,238,.12); color: var(--cyan); font-weight: 600; }
.adm-dot { display: none; width: 8px; height: 8px; border-radius: 50%; background: var(--red); position: absolute; right: 14px; top: 50%; transform: translateY(-50%); }
.adm-dot.show { display: inline-block; }
.adm-front { margin-top: 10px; text-align: center; padding: 10px; border: 1px solid var(--line); border-radius: 10px; font-size: 13px; }

.adm-main { display: flex; flex-direction: column; min-width: 0; }
.adm-top { display: flex; align-items: center; justify-content: space-between; padding: 20px 28px; border-bottom: 1px solid var(--line); background: rgba(14,22,32,.7); backdrop-filter: blur(8px); position: sticky; top: 0; z-index: 5; }
.adm-top h1 { font-size: 20px; font-weight: 700; }
.adm-top p { color: var(--dim); font-size: 12.5px; }
.adm-topright { display: flex; align-items: center; gap: 14px; }
#admWho { color: var(--dim); font-size: 13px; }
.adm-body { padding: 24px 28px; }
.adm-panel { display: none; }
.adm-panel.active { display: block !important; }

/* 卡片 */
.adm-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 20px; }
.adm-stat { background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 18px 20px; }
.adm-stat span { color: var(--dim); font-size: 13px; }
.adm-stat strong { display: block; font-size: 28px; font-weight: 800; margin-top: 6px; color: var(--cyan); font-variant-numeric: tabular-nums; }
.adm-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.adm-box { background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 18px 20px; margin-bottom: 16px; }
.adm-box h3 { font-size: 15px; margin-bottom: 14px; }
.adm-boxhead { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.adm-boxhead h3 { margin: 0; }
.adm-note { color: var(--dim); font-size: 12.5px; margin-bottom: 12px; }

/* 表格 */
.adm-table { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 13px; }
thead th { text-align: left; color: var(--dim); font-weight: 600; padding: 10px 12px; border-bottom: 1px solid var(--line); white-space: nowrap; }
tbody td { padding: 11px 12px; border-bottom: 1px solid rgba(255,255,255,.04); vertical-align: middle; }
tbody tr:hover { background: rgba(255,255,255,.02); }
.adm-empty { padding: 30px; text-align: center; color: var(--dim); }
.adm-table .mini { padding: 5px 10px; font-size: 12px; border-radius: 7px; border: 1px solid var(--line); background: transparent; color: var(--cyan); margin-right: 5px; }
.adm-table .mini.danger { color: var(--red); }
.adm-table .mini.ok { color: var(--green); }
.adm-table input, .adm-table select { background: #0a121b; border: 1px solid var(--line); border-radius: 7px; color: var(--txt); padding: 6px 9px; font-size: 12.5px; max-width: 120px; }

/* 状态徽章 */
.badge { display: inline-block; padding: 2px 9px; border-radius: 999px; font-size: 11.5px; font-weight: 600; }
.b-gray { background: rgba(255,255,255,.08); color: var(--dim); }
.b-green { background: rgba(52,211,153,.15); color: var(--green); }
.b-amber { background: rgba(251,191,36,.15); color: var(--amber); }
.b-red { background: rgba(248,113,113,.15); color: var(--red); }
.b-cyan { background: rgba(34,211,238,.15); color: var(--cyan); }

/* 表单 */
.adm-form { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; background: var(--panel2); border: 1px solid var(--line); border-radius: 12px; padding: 16px; margin-bottom: 16px; }
.adm-form input, .adm-form select, .adm-form textarea { background: #0a121b; border: 1px solid var(--line); border-radius: 9px; padding: 10px 12px; color: var(--txt); font-size: 13px; outline: none; width: 100%; }
.adm-form textarea { grid-column: 1 / -1; resize: vertical; }
.adm-form-actions { grid-column: 1 / -1; display: flex; gap: 10px; }
.adm-gen { display: flex; gap: 10px; margin-bottom: 16px; align-items: center; }
.adm-gen input { background: #0a121b; border: 1px solid var(--line); border-radius: 9px; padding: 10px 12px; color: var(--txt); width: 140px; }

/* toast */
.adm-toast { position: fixed; left: 50%; bottom: 34px; transform: translateX(-50%) translateY(20px); background: #111c28; border: 1px solid rgba(34,211,238,.4); color: var(--txt); padding: 12px 22px; border-radius: 12px; font-size: 14px; opacity: 0; pointer-events: none; transition: .25s; z-index: 99; box-shadow: 0 12px 40px rgba(0,0,0,.5); }
.adm-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
.adm-toast.err { border-color: var(--red); }
.adm-toast.ok { border-color: var(--green); }

@media (max-width: 1100px) { .adm-cards { grid-template-columns: repeat(2,1fr); } .adm-grid2 { grid-template-columns: 1fr; } .adm-form { grid-template-columns: 1fr; } }
@media (max-width: 820px) { .adm-shell { grid-template-columns: 1fr; } .adm-side { position: static; height: auto; } }

.adm-ticket{border:1px solid var(--border,#e3e9f2);border-radius:12px;padding:14px 16px;margin-bottom:12px;background:var(--card,#fff)}
.adm-ticket-h{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.adm-ticket-h b{font-size:14px;flex:1}
.adm-ticket-time{color:#94a3b8;font-size:12px}
.adm-ticket p{margin:6px 0;font-size:13px;line-height:1.6;color:#33475e}
.adm-ticket-c{color:#0ea5e9!important}
.adm-ticket-r{margin:8px 0;padding:8px 10px;border-radius:8px;background:#ecfeff;border-left:3px solid #22d3ee;font-size:12.5px;color:#155e75}
.adm-ticket-form textarea{width:100%;box-sizing:border-box;border:1px solid #dbe4ef;border-radius:8px;padding:9px 11px;font-size:13px;font-family:inherit;resize:vertical;margin-bottom:8px}
.adm-ticket-actions{display:flex;gap:10px}

/* ===== 后台表格列挤压根治（v21）：列多时保持最小宽度并在容器内横滚，单元格不逐字竖排 ===== */
.adm-table table.admin-table,.adm-table table{min-width:880px;width:100%;table-layout:auto;border-collapse:collapse;}
.adm-table tbody td{white-space:normal;word-break:break-word;line-height:1.5;}
.adm-table tbody td.nowrap,.adm-table thead th{white-space:nowrap;}
.adm-table{width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}

/* ============ 上游密钥管理卡片化（item5 美化） ============ */
.ak-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:14px;}
.api-key-row.ak-card{display:flex;flex-direction:column;gap:9px;padding:15px 16px;border-radius:14px;
  background:var(--bg-card,#fff);border:1px solid var(--border,#e9ebf2);box-shadow:0 4px 16px rgba(30,42,80,.06);transition:.18s;}
.api-key-row.ak-card:hover{border-color:#9adce8;box-shadow:0 8px 24px rgba(14,158,192,.12);transform:translateY(-1px);}
.ak-card .ak-head{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.ak-card .key-name{font-weight:700;font-size:14px;color:var(--text-primary,#1c2233);}
.ak-card .ak-desc{color:var(--text-muted,#98a0b4);font-size:11.5px;margin:-4px 0 0;}
.ak-inputwrap{position:relative;display:flex;align-items:center;}
.ak-card input{width:100%;height:40px;padding:0 52px 0 13px;border-radius:10px;border:1px solid var(--border-strong,#d4d9e6);
  background:var(--bg-input,#f1f3f9);color:var(--text-primary,#1c2233);font-size:13px;font-family:ui-monospace,Consolas,monospace;letter-spacing:.2px;transition:.15s;}
.ak-card input:focus{outline:none;border-color:#0e9ec0;background:#fff;box-shadow:0 0 0 3px rgba(14,158,192,.14);}
.ak-eye{position:absolute;right:7px;width:38px;height:28px;border:none;border-radius:7px;background:#e6edf5;color:#525b70;font-size:12px;cursor:pointer;}
.ak-eye:hover{background:#d7e6ef;color:#0e7490;}
.ak-actions{display:flex;gap:9px;}
.ak-card .test-btn,.ak-card .save-btn{flex:1;height:36px;border-radius:9px;font-size:13px;font-weight:600;cursor:pointer;border:1px solid transparent;transition:.15s;}
.ak-card .test-btn{background:#eef6fb;color:#0e7490;border-color:#cfe8f1;}
.ak-card .test-btn:hover{background:#dff0f8;}
.ak-card .save-btn{background:linear-gradient(135deg,#0e9ec0,#0e7490);color:#fff;}
.ak-card .save-btn:hover{filter:brightness(1.06);}
.ak-card button:disabled{opacity:.6;cursor:not-allowed;}
.key-status{font-size:11px;font-weight:700;padding:3px 10px;border-radius:999px;white-space:nowrap;max-width:55%;overflow:hidden;text-overflow:ellipsis;}
.key-status.connected{background:rgba(16,185,129,.14);color:#059669;}
.key-status.disconnected{background:rgba(148,163,184,.16);color:#64748b;}
.key-status.testing{background:rgba(14,158,192,.14);color:#0e7490;}