/* mlg 专用主题变量与切换器样式 */

/* 亮色默认 */
body {
  --bg-color: #f5f5f7;
  --text-color-primary: #1d1d1f;
  --text-color-secondary: #6e6e73;
  --card-bg: #f5f5f7;
  --card-border: rgba(0, 0, 0, 0.1);
  --input-bg: #f2f2f7;
  --input-border: #8e8e93;
  --input-text: #1d1d1f;
  --focus-ring-color: #0a84ff;
  --btn-primary-bg: #0a84ff;
  --btn-secondary-bg: #e5e5ea;
}

/* 暗色主题 */
body.dark-theme {
  --bg-color: #0b0b0c;
  --text-color-primary: #ffffff;
  --text-color-secondary: #8d8d92;
  --card-bg: #1c1c1e;
  --card-border: rgba(255, 255, 255, 0.1);
  --input-bg: #2c2c2e;
  --input-border: #5a5a5c;
  --input-text: #ffffff;
  --btn-secondary-bg: #3a3a3c;
}

/* 跟随系统 */
@media (prefers-color-scheme: dark) {
  body.system-theme {
    --bg-color: #0b0b0c;
    --text-color-primary: #ffffff;
    --text-color-secondary: #8d8d92;
    --card-bg: #1c1c1e;
    --card-border: rgba(255, 255, 255, 0.1);
    --input-bg: #2c2c2e;
    --input-border: #5a5a5c;
    --input-text: #ffffff;
    --btn-secondary-bg: #3a3a3c;
  }
}

/* 应用变量到页面基础 */
body {
  background: var(--bg-color);
  color: var(--text-color-primary);
}

/* 暗色下画布背景更深，提升对比 */
body.dark-theme .game-canvas { background: #0f172a !important; }
body.dark-theme { background: #000000; }
@media (prefers-color-scheme: dark) {
  body.system-theme .game-canvas { background: #0f172a !important; }
  body.system-theme { background: #000000; }
}

/* 亮色下画布背景为浅黄色 */
body .game-canvas { background: #FFF8E1; }

/* 卡片容器（画布外壳） */
.mlg-card {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 1rem;
  box-shadow: 0 8px 20px rgba(0,0,0,0.06);
}

/* 主题切换器样式 */
.theme-switcher { display:inline-flex; align-items:center; gap:4px; background:#e5e7eb; border-radius:9999px; padding:4px; }
body.dark-theme .theme-switcher, body.system-theme .theme-switcher { background:#1f2937; }
.theme-switcher button { padding:6px; border-radius:9999px; color:#374151; }
body.dark-theme .theme-switcher button, body.system-theme .theme-switcher button { color:#9ca3af; }
.theme-btn-active { background-color: #0a84ff !important; color: #ffffff !important; }
