/* ============================================================
   Meridian 浅色主题（共享）
   供认证页 / 首页等 Meridian 深色页面复用：
   通过 <html data-theme="light"> 启用；无该属性即为默认深色。
   Token 与 admin-theme.css 的浅色 Token 保持一致（支付宝蓝 #1677FF）。
   ============================================================ */

/* ---------- 浅色 Token ---------- */
[data-theme="light"] {
  --bg: oklch(0.972 0.004 250);
  --ink: oklch(0.24 0.024 265);
  --ink-soft: oklch(0.45 0.02 258);
  --ink-faint: oklch(0.56 0.015 258);

  --surface: oklch(1 0 0 / 92%);
  --surface-strong: oklch(1 0 0 / 100%);
  --field: oklch(0.965 0.004 250 / 85%);
  --field-hover: oklch(0.94 0.006 250 / 95%);

  --line: oklch(0.24 0.024 265 / 12%);
  --line-strong: oklch(0.24 0.024 265 / 20%);

  --beam: oklch(0.60 0.22 259);
  --beam-deep: oklch(0.52 0.21 259);
  --beam-alt: oklch(0.60 0.14 240);
  --on-beam: oklch(0.99 0.004 259);
  --beam-shadow: oklch(0.60 0.22 259 / 32%);

  --danger: oklch(0.56 0.19 25);
  --ok: oklch(0.52 0.15 155);

  --shadow-lift:
    0 1px 0 0 rgb(255 255 255 / 90%) inset,
    0 20px 50px -28px rgb(30 45 90 / 22%);
  --shadow-beam: 0 14px 36px -20px var(--beam-shadow);
}

/* ---------- 背景氛围 ---------- */
[data-theme="light"] .bg {
  background:
    radial-gradient(90rem 46rem at 12% -10%, oklch(0.60 0.22 259 / 10%), transparent 62%),
    radial-gradient(70rem 40rem at 96% 8%, oklch(0.52 0.12 235 / 9%), transparent 58%),
    radial-gradient(60rem 50rem at 70% 108%, oklch(0.55 0.12 320 / 8%), transparent 60%);
}
[data-theme="light"] .bg::before {
  background-image:
    linear-gradient(to right, oklch(0.24 0.024 265 / 5%) 1px, transparent 1px),
    linear-gradient(to bottom, oklch(0.24 0.024 265 / 5%) 1px, transparent 1px);
}

/* ---------- 认证页（auth.css）硬编码深色 → 浅色 ---------- */
[data-theme="light"] .box { background: oklch(1 0 0 / 100%); }
[data-theme="light"] .consent-box { background: var(--field); }
[data-theme="light"] .btn-alt { background: var(--field); }
[data-theme="light"] .control input:focus {
  box-shadow: 0 0 0 4px oklch(0.60 0.22 259 / 20%);
}
[data-theme="light"] input:focus-visible + .box {
  box-shadow: 0 0 0 3px oklch(0.60 0.22 259 / 30%);
}
[data-theme="light"] .consent-box:has(input:checked) {
  border-color: oklch(0.60 0.22 259 / 45%);
}

/* ---------- 首页（home.css）硬编码深色 → 浅色 ---------- */
[data-theme="light"] .nav-cta { background: var(--field); }
[data-theme="light"] .nav-cta:hover { border-color: oklch(0.60 0.22 259 / 45%); }
[data-theme="light"] .hero-tag { background: oklch(1 0 0 / 55%); }
[data-theme="light"] .cap { background: oklch(1 0 0 / 70%); }
[data-theme="light"] .cap:hover { background: oklch(1 0 0 / 92%); }
[data-theme="light"] .cap-icon { background: var(--field); }
[data-theme="light"] .kpi { background: var(--field); }
[data-theme="light"] .btn-hero.ghost { background: var(--field); }
[data-theme="light"] .closer {
  background:
    radial-gradient(40rem 18rem at 18% 0%, oklch(0.60 0.22 259 / 14%), transparent 62%),
    oklch(1 0 0 / 82%);
}
[data-theme="light"] .chart i {
  background: linear-gradient(180deg, oklch(0.60 0.22 259 / 85%), oklch(0.58 0.11 235 / 35%));
}

/* ---------- 主题切换过渡 ---------- */
.theme-fading,
.theme-fading *,
.theme-fading *::before,
.theme-fading *::after {
  transition:
    background-color 0.35s ease,
    color 0.35s ease,
    border-color 0.35s ease,
    box-shadow 0.35s ease,
    fill 0.35s ease,
    stroke 0.35s ease !important;
}
