/**
 * /app/assets/css/base/tokens.css — KDCA 공통 디자인 토큰 (단계-33)
 *
 * 사용자 전략 (2026-05-29):
 *   "페이지마다 CSS를 준비 → 나중에 공통 추출 + 페이지별 차이는 별도 CSS"
 *
 * 본 파일 = 공통 토큰 (변수만, 컴포넌트 X)
 * 각 페이지 = pages/{name}.css (디자인 보존용 독립)
 * 추후 완전 안정 후 → utilities.css 추출 가능
 */

:root {
    /* 브랜드 컬러 */
    --kdca-red: #e41b45;
    --kdca-red-dark: #b8163a;
    --kdca-red-light: #ff4a6e;
    --kdca-grad-brand: linear-gradient(135deg, #e41b45 0%, #b8163a 100%);
    --kdca-grad-hero: linear-gradient(135deg, #e41b45 0%, #ff6b6b 100%);

    /* 그레이 스케일 */
    --kdca-gray-50: #fafbfc;
    --kdca-gray-100: #f5f6f8;
    --kdca-gray-200: #e8eaed;
    --kdca-gray-300: #d0d4d9;
    --kdca-gray-400: #9aa0a6;
    --kdca-gray-500: #6c7177;
    --kdca-gray-700: #3c4043;
    --kdca-gray-800: #2a2e33;
    --kdca-gray-900: #1a1d20;

    /* 상태 컬러 */
    --kdca-success: #0a6;
    --kdca-info: #055a96;
    --kdca-warning: #9a5a00;
    --kdca-danger: #b8163a;

    /* 표면 */
    --kdca-bg: #fafbfc;
    --kdca-surface: #fff;
    --kdca-text: #1a1d20;
    --kdca-text-muted: #6c7177;
    --kdca-border: #e8eaed;

    /* 그림자 */
    --kdca-shadow-xs: 0 1px 2px rgba(0,0,0,0.04);
    --kdca-shadow-sm: 0 2px 6px rgba(0,0,0,0.06);
    --kdca-shadow-md: 0 4px 16px rgba(0,0,0,0.08);
    --kdca-shadow-lg: 0 8px 32px rgba(0,0,0,0.12);

    /* 반경 */
    --kdca-radius-sm: 4px;
    --kdca-radius-md: 8px;
    --kdca-radius-lg: 12px;

    /* 타이포 */
    --kdca-font: 'Noto Sans KR', 'Pretendard', -apple-system, BlinkMacSystemFont, sans-serif;
    --kdca-font-mono: 'JetBrains Mono', 'Cascadia Code', Consolas, monospace;
    --kdca-text-xs: 11px;
    --kdca-text-sm: 12px;
    --kdca-text-base: 13px;
    --kdca-text-md: 14px;
    --kdca-text-lg: 16px;
    --kdca-text-xl: 20px;
    --kdca-text-2xl: 24px;
    --kdca-text-3xl: 28px;

    /* 트랜지션 */
    --kdca-trans: 0.18s cubic-bezier(.4,0,.2,1);
    --kdca-trans-slow: 0.35s cubic-bezier(.4,0,.2,1);

    /* 레이아웃 */
    --kdca-container-max: 1280px;
    --kdca-container-pad: 20px;
    --kdca-sidebar-w: 220px;
    --kdca-header-h: 64px;
}

/* 다크 모드 토큰 */
[data-theme="dark"] {
    --kdca-bg: #0d1117;
    --kdca-surface: #1a1d20;
    --kdca-text: #e6edf3;
    --kdca-text-muted: #9aa0a6;
    --kdca-border: #2a2e33;
    --kdca-gray-50: #0d1117;
    --kdca-gray-100: #1a1d20;
    --kdca-gray-200: #2a2e33;
    --kdca-gray-300: #3c4043;
    --kdca-gray-700: #c9d1d9;
    --kdca-gray-900: #e6edf3;
}

/* 기본 reset (선택) */
.kdca-reset * { box-sizing: border-box; }
.kdca-reset a { color: var(--kdca-red); text-decoration: none; transition: color var(--kdca-trans); }
.kdca-reset a:hover { color: var(--kdca-red-dark); }

/* 230: admin 구조 토큰 통합 (상위집합 승격, 2026-05-30) — 페이지 영향 없음(가산만) */
:root{
  --kdca-text-4xl: 2.25rem;
  --kdca-fw-light: 300;
  --kdca-fw-normal: 400;
  --kdca-fw-medium: 500;
  --kdca-fw-semibold: 600;
  --kdca-fw-bold: 700;
  --kdca-fw-extra: 800;
  --kdca-leading-tight: 1.25;
  --kdca-leading-snug: 1.4;
  --kdca-leading-normal: 1.5;
  --kdca-leading-relaxed: 1.625;
  --kdca-space-0: 0;
  --kdca-space-1: 0.25rem;
  --kdca-space-2: 0.5rem;
  --kdca-space-3: 0.75rem;
  --kdca-space-4: 1rem;
  --kdca-space-5: 1.25rem;
  --kdca-space-6: 1.5rem;
  --kdca-space-8: 2rem;
  --kdca-space-10: 2.5rem;
  --kdca-space-12: 3rem;
  --kdca-radius-xs: 4px;
  --kdca-radius: 8px;
  --kdca-radius-xl: 16px;
  --kdca-radius-2xl: 22px;
  --kdca-radius-pill: 9999px;
  --kdca-border-thin: 1px;
  --kdca-border-bold: 2px;
  --kdca-shadow: 0 4px 12px rgba(0,0,0,0.08);
  --kdca-shadow-xl: 0 16px 48px rgba(0,0,0,0.12);
  --kdca-shadow-glow: 0 0 16px rgba(201,168,106,0.25);
  --kdca-transition-fast: 100ms ease;
  --kdca-transition: 180ms ease;
  --kdca-transition-slow: 320ms ease;
  --kdca-z-sticky: 100;
  --kdca-z-fixed: 1000;
  --kdca-z-dropdown: 1010;
  --kdca-z-modal-bg: 1040;
  --kdca-z-modal: 1050;
  --kdca-z-popover: 1060;
  --kdca-z-tooltip: 1070;
  --kdca-z-toast: 1080;
  --kdca-bp-sm: 576px;
  --kdca-bp-md: 768px;
  --kdca-bp-lg: 992px;
  --kdca-bp-xl: 1200px;
  --kdca-state-ok: #28a745;
  --kdca-state-warn: #ffc107;
  --kdca-state-err: #dc3545;
  --kdca-state-info: #17a2b8;
  --kdca-state-muted: #6c757d;
  --kdca-gray-600: #868e96;
  --kdca-gray-950: #0f1216;
}
