/* ============================================================
   高级感主题覆盖 · 明亮清爽 × 青蓝点缀 (加载于原内联样式之后, 零侵入可回退)
   白色底 + 浅灰分隔 + 青蓝主色, 数据可读性优先
   只改视觉, 不动任何 DOM / JS / 接口
   ============================================================ */
:root {
  --bg: #f5f7fa;
  --bg-deep: #eef1f6;
  --surface: #ffffff;
  --surface-2: #f7f9fc;
  --surface-3: #edf1f7;
  --border: #e6eaf1;
  --border-strong: #d4dae4;
  --text: #1f2937;
  --text-2: #52606d;
  --text-3: #8a95a5;
  --accent: #14b8a6;
  --accent-strong: #0d9488;
  --accent-deep: #0f766e;
  --accent-2: #2563eb;
  --green: #059669;
  --orange: #d97706;
  --red: #dc2626;
  --blue: #2563eb;
  --purple: #7c3aed;
  --shadow: 0 4px 16px rgba(15, 23, 42, 0.06);
  --shadow-lg: 0 10px 36px rgba(15, 23, 42, 0.08);
  --glow-accent: 0 2px 12px rgba(20, 184, 166, 0.15);
}

/* ---------- 基础 ---------- */
body {
  background: var(--bg) !important;
  color: var(--text);
  background-image: none;
  font-feature-settings: "tnum";
  letter-spacing: 0.01em;
}
::selection { background: rgba(20, 184, 166, 0.18); color: #0f766e; }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

/* ---------- 侧边栏 ---------- */
.sidebar {
  background: #ffffff !important;
  border-right: 1px solid var(--border) !important;
  box-shadow: 2px 0 12px rgba(15, 23, 42, 0.04) !important;
}
.sidebar-logo { border-bottom: 1px solid var(--border) !important; padding-bottom: 16px !important; }
.sidebar-logo span {
  background: linear-gradient(100deg, #14b8a6, #0d9488 45%, #2563eb);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: 1.5px;
}
.sidebar-org {
  color: #0d9488 !important;
  background: #f0fdfa !important;
  border: 1px solid #ccfbf1 !important;
  border-radius: 11px !important;
  margin: 0 12px 14px !important;
  padding: 10px 12px !important;
  letter-spacing: 0.4px;
}
.sidebar-menu { padding: 2px 10px 10px !important; }
.sidebar-menu li { margin-bottom: 4px; }
.sidebar-menu a {
  color: var(--text-2) !important;
  border-radius: 10px;
  border: 1px solid transparent;
  margin: 0 !important;
  padding: 9px 10px !important;
  gap: 10px;
  position: relative;
  transition: background 0.18s, border-color 0.18s, color 0.18s, box-shadow 0.18s;
}
.sidebar.collapsed .sidebar-menu a { margin: 0 !important; padding: 8px 6px !important; }
.sidebar-menu a:hover {
  background: #f1f5f9 !important;
  border-color: transparent !important;
  color: var(--text) !important;
}
.sidebar-menu a svg {
  width: 16px;
  height: 16px;
  padding: 7px;
  box-sizing: content-box;
  border-radius: 8px;
  background: transparent;
  border: none;
  margin-right: 10px;
  flex-shrink: 0;
  color: #94a3b8;
  transition: background 0.18s, color 0.18s, box-shadow 0.18s;
}
.sidebar.collapsed .sidebar-menu a svg { margin-right: 0; }
.sidebar-menu a:hover svg {
  background: rgba(20, 184, 166, 0.08);
  color: var(--accent-strong);
}
.sidebar-menu a.active {
  background: #f0fdfa !important;
  border-color: #99f6e4 !important;
  color: var(--accent-deep) !important;
  font-weight: 600;
  box-shadow: 0 2px 8px rgba(20, 184, 166, 0.08);
}
.sidebar-menu a.active::before {
  content: '';
  position: absolute;
  left: -1px;
  top: 22%;
  bottom: 22%;
  width: 3px;
  border-radius: 3px;
  background: linear-gradient(180deg, #14b8a6, #2563eb);
}
.sidebar-menu a.active svg {
  background: #14b8a6;
  color: #fff;
  box-shadow: 0 0 0 1px #14b8a6;
}
.sidebar-toggle {
  background: #fff !important;
  border: 1px solid var(--border) !important;
  color: var(--text-2) !important;
  box-shadow: 0 2px 8px rgba(15,23,42,.06) !important;
}
.sidebar-toggle:hover { background: #f8fafc !important; color: var(--accent-strong) !important; }
.sidebar-overlay { background: rgba(15, 23, 42, 0.4) !important; }

/* ---------- 顶栏 ---------- */
.header {
  background: #ffffff !important;
  border-bottom: 1px solid var(--border) !important;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.02);
}
.header-title {
  background: linear-gradient(100deg, #14b8a6, #0d9488 45%, #2563eb);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 700;
  letter-spacing: 0.5px;
}
.header-user { color: var(--text-2) !important; }
.header-user .username { color: var(--text) !important; font-weight: 600; }
.header-avatar {
  background: linear-gradient(135deg, #14b8a6, #2563eb) !important;
  color: #fff !important;
  box-shadow: 0 2px 8px rgba(20, 184, 166, 0.15);
}
.logout-btn {
  background: transparent !important;
  border: 1px solid var(--border-strong) !important;
  color: var(--text-2) !important;
  border-radius: 8px;
}
.logout-btn:hover { background: #fef2f2 !important; color: #dc2626 !important; border-color: #fecaca !important; }

/* ---------- 主面板 ---------- */
.main-content { background: transparent !important; }
.content-card, .card, .panel, .box,
.search-bar, .total-card, .home-kpi-row .home-kpi-card,
.publisher-tabs, .publisher-tab-content,
.publisher-card, .publisher-panel,
.table-container, .chart-container, .filter-bar {
  background: #ffffff !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px;
  box-shadow: var(--shadow);
}
.publisher-card, .publisher-panel {
  border-radius: 12px;
}
.search-bar {
  background: #ffffff !important;
  padding: 16px 20px;
  margin-bottom: 16px;
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: flex-end;
}
.search-item label {
  color: var(--text-2);
  font-size: 12px;
  font-weight: 500;
  margin-bottom: 6px;
  display: block;
  letter-spacing: 0.3px;
}

/* ---------- 表格 ---------- */
table, .data-table, #ecpm-table, #publisher-table, .publisher-table {
  background: #ffffff !important;
  border-collapse: separate !important;
  border-spacing: 0;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid var(--border);
}
thead th {
  background: #f8fafc !important;
  color: var(--text-2) !important;
  font-weight: 600;
  font-size: 13px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--border);
  letter-spacing: 0.3px;
}
tbody td {
  color: var(--text) !important;
  padding: 12px 14px;
  border-bottom: 1px solid #f1f5f9;
  font-size: 13px;
}
tbody tr:last-child td { border-bottom: none; }
tbody tr:hover td { background: #f0fdfa !important; }
tbody tr:nth-child(even) td { background: #fafbfc; }

/* ---------- 按钮 ---------- */
.btn {
  background: #ffffff;
  border: 1px solid var(--border-strong);
  color: var(--text);
  border-radius: 8px;
  padding: 7px 16px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.15s;
}
.btn:hover { background: #f8fafc; border-color: var(--accent); color: var(--accent-strong); }
.btn-primary, .btn-search {
  background: linear-gradient(135deg, #14b8a6, #0d9488) !important;
  border-color: #0d9488 !important;
  color: #fff !important;
  box-shadow: 0 2px 6px rgba(20, 184, 166, 0.2);
}
.btn-primary:hover, .btn-search:hover {
  box-shadow: 0 4px 12px rgba(20, 184, 166, 0.3);
  transform: translateY(-1px);
}
.btn-success {
  background: #059669 !important; border-color: #059669 !important; color: #fff !important;
}
.btn-danger, .btn-delete {
  background: #dc2626 !important; border-color: #dc2626 !important; color: #fff !important;
}
.btn-detail, .gc-detail-btn {
  background: transparent !important;
  border: 1px solid #14b8a6 !important;
  color: #0d9488 !important;
}
.btn-detail:hover, .gc-detail-btn:hover {
  background: #f0fdfa !important;
}

/* ---------- 输入框 ---------- */
input[type="text"], input[type="password"], input[type="number"], input[type="date"],
input[type="search"], input:not([type]), select, textarea,
.search-dropdown input, .dropdown-list-input {
  background: #ffffff !important;
  border: 1px solid var(--border-strong) !important;
  color: var(--text) !important;
  border-radius: 8px;
  padding: 8px 12px !important;
  font-size: 13px;
  transition: border-color 0.15s, box-shadow 0.15s;
}
input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: #14b8a6 !important;
  box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.12) !important;
}
.dropdown-list {
  background: #ffffff !important;
  border: 1px solid var(--border-strong) !important;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08) !important;
  border-radius: 8px;
  max-height: 240px;
  overflow-y: auto;
}
.dropdown-list option, .dropdown-item {
  padding: 8px 12px;
  color: var(--text);
  border-bottom: 1px solid #f1f5f9;
  cursor: pointer;
}
.dropdown-list option:hover, .dropdown-item:hover,
.dropdown-list option.selected, .dropdown-item.selected {
  background: #f0fdfa;
  color: #0d9488;
}

/* ---------- 分页 ---------- */
.pagination {
  background: #ffffff !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px;
  padding: 12px 16px;
  margin-top: 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}
.pagination button {
  background: #ffffff;
  border: 1px solid var(--border-strong);
  color: var(--text-2);
  border-radius: 6px;
  padding: 5px 12px;
  font-size: 12px;
  cursor: pointer;
  margin-right: 4px;
}
.pagination button:hover:not(:disabled) {
  border-color: #14b8a6;
  color: #0d9488;
  background: #f0fdfa;
}
.pagination button.active {
  background: linear-gradient(135deg, #14b8a6, #0d9488);
  border-color: #0d9488;
  color: #fff;
}
.pagination button:disabled { opacity: 0.4; cursor: not-allowed; }
.pagination-info { color: var(--text-3); font-size: 12px; }

/* ---------- 弹窗 ---------- */
.modal-overlay {
  background: rgba(15, 23, 42, 0.45) !important;
  backdrop-filter: blur(2px);
}
.modal, .dialog, .modal-content {
  background: #ffffff !important;
  border: 1px solid var(--border) !important;
  border-radius: 14px !important;
  box-shadow: 0 20px 60px rgba(15, 23, 42, 0.18) !important;
}
.modal-header, .modal-header h3 {
  color: var(--text) !important;
  border-bottom: 1px solid var(--border);
}
.modal-body { color: var(--text-2); }

/* ---------- Toast ---------- */
.toast {
  background: #ffffff !important;
  border: 1px solid var(--border-strong) !important;
  border-radius: 10px;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.12) !important;
  color: var(--text) !important;
}
.toast.success { border-color: #059669; background: #ecfdf5 !important; color: #065f46 !important; }
.toast.error { border-color: #dc2626; background: #fef2f2 !important; color: #991b1b !important; }
.toast.info { border-color: #2563eb; background: #eff6ff !important; color: #1e40af !important; }

/* ---------- Tag / Badge ---------- */
.tag, .badge, .status-tag {
  font-size: 11px;
  padding: 2px 9px;
  border-radius: 10px;
  font-weight: 500;
}
.tag-success, .status-active { background: #ecfdf5; color: #059669; border: 1px solid #a7f3d0; }
.tag-error, .status-error { background: #fef2f2; color: #dc2626; border: 1px solid #fecaca; }
.tag-warning { background: #fffbeb; color: #d97706; border: 1px solid #fde68a; }
.tag-info { background: #eff6ff; color: #2563eb; border: 1px solid #bfdbfe; }

/* ---------- Tab ---------- */
.publisher-tabs, .tabs {
  background: #ffffff !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px;
  padding: 4px;
  display: inline-flex;
  gap: 2px;
}
.publisher-tab, .tab {
  padding: 8px 16px;
  border-radius: 8px;
  color: var(--text-2);
  font-weight: 500;
  font-size: 13px;
  cursor: pointer;
  transition: all 0.15s;
  border: none;
  background: transparent;
}
.publisher-tab:hover { color: var(--text); background: #f1f5f9; }
.publisher-tab.active {
  background: linear-gradient(135deg, #14b8a6, #0d9488);
  color: #fff !important;
  box-shadow: 0 2px 6px rgba(20, 184, 166, 0.25);
}

/* ============================================================
   首页 KPI + 游戏卡片 (明亮版)
   ============================================================ */

/* ---- KPI 条 ---- */
.home-kpi-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin: 18px 0 24px;
}
.home-kpi-card {
  background: #ffffff;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 18px 20px;
  display: flex;
  gap: 14px;
  align-items: center;
  position: relative;
  box-shadow: var(--shadow);
  transition: transform 0.2s, box-shadow 0.2s;
}
.home-kpi-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-lg);
}
.kpi-icon {
  width: 46px;
  height: 46px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  font-weight: 700;
  flex-shrink: 0;
}
.kpi-rev .kpi-icon  { background: linear-gradient(135deg, #f472b6, #f59e0b); color: #fff; }
.kpi-avg .kpi-icon  { background: linear-gradient(135deg, #14b8a6, #2563eb); color: #fff; }
.kpi-games .kpi-icon{ background: linear-gradient(135deg, #a78bfa, #ec4899); color: #fff; }
.kpi-rows .kpi-icon { background: linear-gradient(135deg, #34d399, #22d3ee); color: #fff; }
.kpi-body { flex: 1; min-width: 0; }
.kpi-lbl { font-size: 12px; color: var(--text-3); margin-bottom: 4px; letter-spacing: 0.3px; }
.kpi-val {
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.5px;
  font-variant-numeric: tabular-nums;
  color: var(--text);
}
.kpi-rev .kpi-val { color: #dc2626; }

/* ---- 游戏卡片网格 ---- */
.games-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}
.game-card {
  position: relative;
  background: #ffffff;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 22px;
  cursor: pointer;
  transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
  box-shadow: var(--shadow);
  overflow: hidden;
}
.game-card:hover {
  transform: translateY(-3px);
  border-color: #99f6e4;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.1), 0 0 0 3px rgba(20, 184, 166, 0.08);
}

.gc-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}
.gc-name {
  font-size: 15px;
  font-weight: 600;
  color: var(--text);
  max-width: 70%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.gc-status {
  font-size: 11px;
  padding: 3px 10px;
  border-radius: 20px;
  font-weight: 600;
  letter-spacing: 0.5px;
}
.gc-status.on { background: #ecfdf5; color: #059669; border: 1px solid #a7f3d0; }
.gc-status.off { background: #f1f5f9; color: #94a3b8; border: 1px solid #e2e8f0; }

.gc-main {
  text-align: center;
  padding: 18px 0 14px;
  border-top: 1px dashed #e2e8f0;
  border-bottom: 1px dashed #e2e8f0;
  margin-bottom: 14px;
}
.gc-big-amount {
  font-size: 38px;
  font-weight: 800;
  letter-spacing: -1px;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  background: linear-gradient(100deg, #0d9488, #2563eb);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.gc-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  padding-top: 4px;
}
.gc-foot-item {
  flex: 1;
  text-align: center;
  min-width: 0;
}
.gc-foot-lbl {
  display: block;
  font-size: 11px;
  color: var(--text-3);
  margin-bottom: 3px;
  letter-spacing: 0.3px;
}
.gc-foot-val {
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
  font-variant-numeric: tabular-nums;
  display: block;
}
.gc-foot-sep {
  width: 1px;
  height: 26px;
  background: #e2e8f0;
  flex-shrink: 0;
}

.gc-detail-btn {
  position: absolute;
  bottom: 14px;
  right: 16px;
  font-size: 12px;
  padding: 4px 12px;
  border-radius: 14px;
  background: transparent;
  border: 1px solid #14b8a6;
  color: #0d9488;
  cursor: pointer;
  transition: background 0.18s, color 0.18s;
}
.gc-detail-btn:hover {
  background: #f0fdfa;
  color: #0f766e;
}

/* ---------- 响应式 ---------- */
@media (max-width: 1200px) {
  .home-kpi-row { grid-template-columns: repeat(2, 1fr); }
  .games-grid   { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  .home-kpi-row { grid-template-columns: 1fr; }
  .games-grid   { grid-template-columns: 1fr; }
  .gc-big-amount { font-size: 30px; }
}

/* ============================================================
   HTML 内联样式修正 (反向: 原站浅色背景现在变深灰, 深色字现在变浅)
   ============================================================ */

/* -- 原站浅色面板现在保留浅色 (本主题已白底, 不需要再反) -- */
[style*="background:#f8f9fa"], [style*="background:#f6f9ff"], [style*="background:#f6fff6"],
[style*="background:#fffbe6"], [style*="background:#e3f2fd"], [style*="background:#f0faff"],
[style*="background:#e6f7ff"], [style*="background:#fafafa"],
[style*="background:#f5f5f5"], [style*="background:#f7f8fa"],
[style*="background:#e8e8e8"], [style*="background:#fdfdfd"],
[style*="background:#fefefe"], [style*="background:#f9f9f9"] {
  background: #f8fafc !important;
}
[style*="background:#fff"], [style*="background: #fff"] { background: #ffffff !important; }
[style*="background:#fff1f0"], [style*="background: #fff1f0"] { background: #fef2f2 !important; }
[style*="background:#fff7e6"], [style*="background: #fff7e6"] { background: #fffbeb !important; }

/* -- 原站浅灰描边 → 浅灰描边 (本主题本身就是浅色, 稍微加深) -- */
[style*="border:1px solid #eee"], [style*="border:1px solid #e8e8e8"],
[style*="border:1px solid #e0e8f5"], [style*="border:1px solid #dbe7ff"],
[style*="border:1px solid #d9f0d9"], [style*="border:1px solid #ffe58f"],
[style*="border:1px solid #91d5ff"], [style*="border:1px solid #f0f0f0"],
[style*="border:1px solid #e6f7ff"], [style*="border:1px solid #ddd"],
[style*="border:1px solid #ccc"], [style*="border:1px solid #d0d0d0"],
[style*="border:1px solid #d9d9d9"] {
  border-color: #e2e8f0 !important;
}
[style*="border:1px solid #ffccc7"], [style*="border:1px solid #ffd591"],
[style*="border:1px solid #fff1f0"], [style*="border:1px solid #fff7e6"] {
  border-color: #e2e8f0 !important;
}

/* -- 原站深色文字色号 → 深色文字 (本主题已浅色底, 深色字要保留深色) -- */
[style*="color:#333"], [style*="color: #333"] { color: #1f2937 !important; }
[style*="color:#555"], [style*="color: #555"] { color: #374151 !important; }
[style*="color:#666"], [style*="color: #666"], [style*="color:#595959"] { color: #4b5563 !important; }
[style*="color:#999"], [style*="color: #999"], [style*="color:#8c8c8c"],
[style*="color:#7a93bd"], [style*="color:#8a9bb8"], [style*="color:#6a9a6a"],
[style*="color:#ccc"], [style*="color: #ccc"], [style*="color:#bbb"],
[style*="color:#aaa"], [style*="color:#777"] { color: #6b7280 !important; }
[style*="color:#1e4fa0"] { color: #2563eb !important; }
[style*="color:#2a7d2a"] { color: #059669 !important; }
[style*="color:#1976d2"], [style*="color:#096dd9"], [style*="color:#1890ff"],
[style*="color:#2f54eb"], [style*="color:#2f3640"] { color: #2563eb !important; }
[style*="color:#FE2C55"], [style*="color: #FE2C55"], [style*="color:#f5222d"],
[style*="color:#cf1322"], [style*="color:#ff4d4f"] { color: #dc2626 !important; }
[style*="color:#ad6800"], [style*="color:#fa8c16"],
[style*="color:#d46b08"], [style*="color:#fadb14"] { color: #d97706 !important; }
[style*="color:#52c41a"], [style*="color:#389e0d"] { color: #059669 !important; }
[style*="color:#722ed1"], [style*="color:#9254de"] { color: #7c3aed !important; }
[style*="color:#096dd9"] { color: #2563eb !important; }
[style*="color:#262626"], [style*="color:#1a1a1a"], [style*="color:#000"] { color: #111827 !important; }

/* -- code 标记 -- */
code[style*="background:#fff1f0"], code {
  background: #f0fdfa !important;
  color: #0d9488 !important;
  border-radius: 4px;
  padding: 1px 6px;
}

/* -- 原站方角 → 现代圆角 -- */
[style*="border-radius:4px"], [style*="border-radius: 4px"] { border-radius: 7px !important; }
[style*="border-radius:6px"], [style*="border-radius: 6px"] { border-radius: 9px !important; }

/* -- 下拉框 -- */
#publisher-game-dropdown, #adconfig-game-dropdown,
#logquery-game-dropdown, #oauth-preview-game-dropdown, #game-org-dropdown,
#user-org-dropdown, .org-dropdown {
  background: #ffffff !important;
  border: 1px solid var(--border-strong) !important;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08) !important;
  border-radius: 10px !important;
}

.btn-toggle-pwd {
  background: #ffffff !important;
  border: 1px solid var(--border-strong) !important;
  color: var(--text-2) !important;
}
.btn-toggle-pwd:hover { color: var(--accent-strong) !important; border-color: #14b8a6 !important; }

/* -- 二维码边框 -- */
[style*="border:1px solid #e8e8e8"][style*="border-radius:8px"] {
  border-color: var(--border-strong) !important;
}

/* -- 深色背景上的白字保留原样 -- */
[style*="color:#fff"][style*="background:"], [style*="color:#ffffff"][style*="background:"] {
}