/*
 * shadcn/ui 토큰 — prefers-color-scheme 자동 전환판. TASK:T1015.
 * 원본(.dark 클래스 스코프, 수동 토글 전제)은
 * ono-build/ref/design-tokens/shadcn-tokens.css 에 그대로 둔다 — 이 파일은
 * 그 값을 그대로 가져와 :root 재정의 + 미디어쿼리 형태로만 바꾼 사본이다.
 * :root 가 라이트 기본값이고, @media (prefers-color-scheme: dark) 안에서
 * 같은 :root 를 재정의해 방문자 OS/브라우저 설정만으로 클래스 토글 없이
 * 자동 전환된다.
 *
 * Elementor Kit 전역색상(--e-global-color-shadcn-*, --e-global-color-shadcn-dark-*,
 * TASK:T1014)과는 이름공간이 겹치지 않는 별개 체계다 — Kit 쪽은 Elementor
 * 위젯 컨트롤이 참조하고 사람이 위젯마다 라이트/다크 색을 골라야 하는
 * 정적 값(hex, 자동전환 안 됨)이고, 이 파일의 변수는 테마 레벨(body 등
 * Elementor 밖의 요소, 또는 var() 로 직접 참조하게 만든 위젯)에 자동으로
 * 걸리는 값(oklch, prefers-color-scheme 자동전환)이다. 충돌하지 않으므로
 * 병행 가능 — 정적 배색이 필요한 곳은 Kit 전역색상을, 자동 전환이 필요한
 * 곳은 이 파일의 var(--background) 등을 쓴다.
 */

:root {
  --background: oklch(1 0 0);
  --foreground: oklch(0.145 0 0);
  --card: oklch(1 0 0);
  --card-foreground: oklch(0.145 0 0);
  --popover: oklch(1 0 0);
  --popover-foreground: oklch(0.145 0 0);
  --primary: oklch(0.205 0 0);
  --primary-foreground: oklch(0.985 0 0);
  --secondary: oklch(0.97 0 0);
  --secondary-foreground: oklch(0.205 0 0);
  --accent: oklch(0.97 0 0);
  --accent-foreground: oklch(0.205 0 0);
  --muted: oklch(0.97 0 0);
  --muted-foreground: oklch(0.556 0 0);
  --destructive: oklch(0.577 0.245 27.325);
  --border: oklch(0.922 0 0);
  --input: oklch(0.922 0 0);
  --ring: oklch(0.708 0 0);
  --chart-1: oklch(0.87 0 0);
  --chart-2: oklch(0.556 0 0);
  --chart-3: oklch(0.439 0 0);
  --chart-4: oklch(0.371 0 0);
  --chart-5: oklch(0.269 0 0);
  --sidebar: oklch(0.985 0 0);
  --sidebar-foreground: oklch(0.145 0 0);
  --sidebar-primary: oklch(0.205 0 0);
  --sidebar-primary-foreground: oklch(0.985 0 0);
  --sidebar-accent: oklch(0.97 0 0);
  --sidebar-accent-foreground: oklch(0.205 0 0);
  --sidebar-border: oklch(0.922 0 0);
  --sidebar-ring: oklch(0.708 0 0);
  --radius: 0.625rem;
  --radius-sm: calc(var(--radius) * 0.6);
  --radius-md: calc(var(--radius) * 0.8);
  --radius-lg: var(--radius);
  --radius-xl: calc(var(--radius) * 1.4);
  --radius-2xl: calc(var(--radius) * 1.8);
  --spacing: 0.25rem;
}

@media (prefers-color-scheme: dark) {
  :root {
    --background: oklch(0.145 0 0);
    --foreground: oklch(0.985 0 0);
    --card: oklch(0.205 0 0);
    --card-foreground: oklch(0.985 0 0);
    --popover: oklch(0.205 0 0);
    --popover-foreground: oklch(0.985 0 0);
    --primary: oklch(0.922 0 0);
    --primary-foreground: oklch(0.205 0 0);
    --secondary: oklch(0.269 0 0);
    --secondary-foreground: oklch(0.985 0 0);
    --muted: oklch(0.269 0 0);
    --muted-foreground: oklch(0.708 0 0);
    --accent: oklch(0.269 0 0);
    --accent-foreground: oklch(0.985 0 0);
    --destructive: oklch(0.704 0.191 22.216);
    --border: oklch(1 0 0 / 10%);
    --input: oklch(1 0 0 / 15%);
    --ring: oklch(0.556 0 0);
    --sidebar: oklch(0.205 0 0);
    --sidebar-foreground: oklch(0.985 0 0);
    --sidebar-primary: oklch(0.488 0.243 264.376);
    --sidebar-primary-foreground: oklch(0.985 0 0);
    --sidebar-accent: oklch(0.269 0 0);
    --sidebar-accent-foreground: oklch(0.985 0 0);
    --sidebar-border: oklch(1 0 0 / 10%);
    --sidebar-ring: oklch(0.556 0 0);
  }
}

/* 토큰이 실제로 뭔가에 적용돼야 자동전환을 눈으로 검증할 수 있다 —
   Elementor Container 가 hero-page-fold(canvas 템플릿, body 안이 전체를
   덮는 구조)를 이미 하드코딩 색으로 채우고 있어 body 배경은 화면에
   드러나지 않을 수 있다(TASK:T1015 보고에 명시). */
body {
  background-color: var(--background);
  color: var(--foreground);
}
