/* ==========================================
   New-API 中文 SaaS 风格主题
   Chinese SaaS Style Theme for New-API
   ========================================== */

/* --- Light Mode (Override CSS Variables) --- */
:root {
  /* 主色调：阿里巴巴蓝 #1677ff */
  --primary: oklch(0.57 0.15 255);
  --primary-foreground: oklch(1 0 0);
  --ring: oklch(0.55 0.14 255);

  /* 侧边栏：纯白底色 */
  --sidebar: oklch(1 0 0);
  --sidebar-foreground: oklch(0.35 0.02 260);
  --sidebar-primary: oklch(0.57 0.15 255);
  --sidebar-primary-foreground: oklch(1 0 0);
  --sidebar-accent: oklch(0.93 0.03 250);
  --sidebar-accent-foreground: oklch(0.57 0.15 255);
  --sidebar-border: oklch(0.92 0.01 240);
  --sidebar-ring: oklch(0.55 0.14 255);

  /* 背景：阿里云风格浅蓝灰 */
  --background: oklch(0.97 0.005 240);
  --foreground: oklch(0.18 0.02 260);

  /* 卡片和弹窗 */
  --card: oklch(1 0 0);
  --card-foreground: oklch(0.18 0.02 260);
  --popover: oklch(1 0 0);
  --popover-foreground: oklch(0.18 0.02 260);

  /* 次要和中性色 */
  --secondary: oklch(0.95 0.01 240);
  --secondary-foreground: oklch(0.4 0.03 255);
  --muted: oklch(0.96 0.01 240);
  --muted-foreground: oklch(0.55 0.02 260);
  --accent: oklch(0.93 0.03 250);
  --accent-foreground: oklch(0.18 0.02 260);
  --neutral: oklch(0.6 0.02 260);
  --neutral-foreground: oklch(0.98 0 0);

  /* 边框和输入框 */
  --border: oklch(0.92 0.01 240);
  --input: oklch(0.92 0.01 240);

  /* 状态色 */
  --success: oklch(0.62 0.15 145);
  --success-foreground: oklch(0.99 0 0);
  --warning: oklch(0.72 0.16 75);
  --warning-foreground: oklch(0.15 0 0);
  --destructive: oklch(0.58 0.20 25);
  --destructive-foreground: oklch(0.99 0 0);
  --info: oklch(0.58 0.14 240);
  --info-foreground: oklch(0.99 0 0);

  /* 圆角：更紧凑的 6px */
  --radius: 0.5rem;

  /* 图表色：阿里云风格蓝绿紫 */
  --chart-1: oklch(0.57 0.15 255);
  --chart-2: oklch(0.62 0.15 145);
  --chart-3: oklch(0.65 0.13 285);
  --chart-4: oklch(0.55 0.14 200);
  --chart-5: oklch(0.68 0.16 325);

  /* 概览卡片强调色 */
  --overview-accent-1: oklch(0.57 0.15 255);
  --overview-accent-2: oklch(0.62 0.15 145);
  --overview-accent-3: oklch(0.65 0.13 285);

  /* 表格 */
  --table-row: oklch(1 0 0);
  --table-header: oklch(0.97 0.005 240);
  --table-header-hover: oklch(0.95 0.01 240);
  --table-disabled: oklch(0.96 0.01 240);
  --table-disabled-hover: oklch(0.94 0.01 240);
  --table-disabled-border: oklch(0.9 0.01 240);

  /* 骨架屏 */
  --skeleton-base: oklch(0.94 0.01 240);
  --skeleton-highlight: oklch(0.97 0.005 240);

  /* 字体：中文优先 */
  --font-body: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC',
    'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial,
    sans-serif;
}

/* --- Dark Mode: 深蓝黑色系 --- */
.dark {
  --background: oklch(0.18 0.02 260);
  --foreground: oklch(0.92 0.01 240);

  --card: oklch(0.21 0.02 260);
  --card-foreground: oklch(0.92 0.01 240);
  --popover: oklch(0.21 0.02 260);
  --popover-foreground: oklch(0.92 0.01 240);

  --primary: oklch(0.65 0.14 255);
  --primary-foreground: oklch(0.15 0 0);

  --secondary: oklch(0.25 0.02 260);
  --secondary-foreground: oklch(0.85 0.03 250);

  --muted: oklch(0.25 0.02 260);
  --muted-foreground: oklch(0.65 0.02 260);

  --accent: oklch(0.28 0.04 260);
  --accent-foreground: oklch(0.92 0.01 240);

  --destructive: oklch(0.65 0.18 25);
  --destructive-foreground: oklch(0.99 0 0);
  --success: oklch(0.65 0.15 145);
  --success-foreground: oklch(0.15 0 0);
  --warning: oklch(0.75 0.16 75);
  --warning-foreground: oklch(0.15 0 0);
  --info: oklch(0.65 0.14 240);
  --info-foreground: oklch(0.15 0 0);

  --border: oklch(1 0 0 / 10%);
  --input: oklch(1 0 0 / 15%);
  --ring: oklch(0.6 0.14 255);

  --sidebar: oklch(0.15 0.02 260);
  --sidebar-foreground: oklch(0.85 0.01 240);
  --sidebar-primary: oklch(0.65 0.14 255);
  --sidebar-primary-foreground: oklch(0.15 0 0);
  --sidebar-accent: oklch(0.22 0.04 260);
  --sidebar-accent-foreground: oklch(0.65 0.14 255);
  --sidebar-border: oklch(1 0 0 / 8%);
  --sidebar-ring: oklch(0.6 0.14 255);

  --chart-1: oklch(0.65 0.14 255);
  --chart-2: oklch(0.65 0.15 145);
  --chart-3: oklch(0.65 0.13 285);
  --chart-4: oklch(0.6 0.14 200);
  --chart-5: oklch(0.65 0.16 325);

  --skeleton-base: oklch(0.25 0.02 260);
  --skeleton-highlight: oklch(0.3 0.02 260);
  --table-row: oklch(0.21 0.02 260);

  --table-header: oklch(0.23 0.02 260);
  --table-header-hover: oklch(0.26 0.02 260);
  --table-disabled: oklch(0.25 0.02 260);
  --table-disabled-hover: oklch(0.27 0.02 260);
  --table-disabled-border: oklch(0.35 0.02 260);
}

/* ==========================================
   附加样式调整 - 中文 SaaS 风格细节
   ========================================== */

/* 侧边栏：白色底色 + 灰色选中态 */
.sidebar-item,
[class*="sidebar"] [class*="nav"] a,
[class*="sidebarItem"] {
  border-radius: 6px !important;
  transition: all 0.15s ease !important;
}

/* 卡片阴影：轻微立体感 */
[class*="card"],
.card,
[class*="Card"] {
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 1px 4px rgba(0, 0, 0, 0.02) !important;
  border: 1px solid var(--border) !important;
  transition: box-shadow 0.2s ease !important;
}

[class*="card"]:hover,
.card:hover,
[class*="Card"]:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06) !important;
}

/* 按钮：更明显的悬浮效果 */
button[class*="primary"],
[class*="ButtonPrimary"],
[class*="btn-primary"] {
  box-shadow: 0 1px 2px rgba(22, 119, 255, 0.15) !important;
  transition: all 0.15s ease !important;
}

button[class*="primary"]:hover,
[class*="ButtonPrimary"]:hover,
[class*="btn-primary"]:hover {
  box-shadow: 0 4px 12px rgba(22, 119, 255, 0.3) !important;
  transform: translateY(-1px) !important;
}

/* 表格表头：浅蓝灰底色 */
th,
[class*="th"],
[class*="TableHeader"] {
  font-weight: 500 !important;
  font-size: 0.8125rem !important;
  color: #666 !important;
}

/* 标签/徽章：圆角矩形风格 */
[class*="badge"],
[class*="Badge"],
[class*="tag"],
[class*="Tag"] {
  border-radius: 4px !important;
  font-weight: 500 !important;
  padding: 1px 10px !important;
}

/* 状态指示器：圆点 */
[class*="statusDot"],
[class*="status-dot"] {
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.8) !important;
}

/* 统计数字：加粗清晰 */
[class*="stat"],
[class*="Stat"],
[class*="statistic"],
[class*="Statistic"] {
  letter-spacing: -0.02em !important;
}

/* 链接：阿里云蓝色 */
a {
  transition: color 0.15s ease !important;
}

/* 输入框聚焦：蓝色边框 */
input:focus,
select:focus,
textarea:focus {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 2px rgba(22, 119, 255, 0.1) !important;
}

/* 侧边栏激活项 */
[class*="sidebar"] [class*="active"],
[class*="sidebarItemActive"],
[class*="sidebar-item"][class*="active"] {
  background: rgba(22, 119, 255, 0.06) !important;
  font-weight: 500 !important;
}

/* 滚动条美化 */
::-webkit-scrollbar {
  width: 6px !important;
  height: 6px !important;
}

::-webkit-scrollbar-track {
  background: transparent !important;
}

::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.1) !important;
  border-radius: 3px !important;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.2) !important;
}

/* 导航栏：更紧凑 */
[class*="header"],
[class*="Header"],
[class*="navbar"],
[class*="Navbar"] {
  background: rgba(255, 255, 255, 0.9) !important;
  backdrop-filter: blur(10px) !important;
  border-bottom: 1px solid var(--border) !important;
}

/* 空状态：更友好 */
[class*="empty"],
[class*="Empty"],
[class*="no-data"],
[class*="NoData"] {
  opacity: 0.7 !important;
}

/* 管理员标签：强调 */
[class*="admin"],
[class*="Admin"],
[class*="root"],
[class*="Root"] {
  font-weight: 500 !important;
}
