/* ==========================================================
   JNCO ERP — Design Tokens
   모든 색상, 간격, 타이포그래피를 한 곳에서 관리합니다.
   관리자 모드 → 테마 설정에서 이 값들을 덮어쓸 수 있습니다.
   ========================================================== */

:root {
  /* ── Brand ───────────────────────────────────── */
  --color-primary:       #1a73e8;
  --color-primary-hover: #1557b0;
  --color-primary-soft:  #e8f0fe;
  --color-primary-border:#d2e3fc;

  /* ── Semantic ────────────────────────────────── */
  --color-success: #34a853;
  --color-danger:  #ea4335;
  --color-warning: #fbbc04;
  --color-info:    #4285f4;

  /* ── Neutrals ────────────────────────────────── */
  --color-bg:        #f4f6f8;
  --color-surface:   #ffffff;
  --color-surface-2: #f8f9fa;
  --color-border:    #e0e4e8;
  --color-border-strong: #ced4da;
  --color-divider:   #eeeeee;

  --color-text:      #333333;
  --color-text-sub:  #5f6368;
  --color-text-mute: #80868b;
  --color-text-inv:  #ffffff;

  --color-gray-50:   #f4f6f8;
  --color-gray-100:  #f1f3f4;
  --color-gray-900:  #202124;

  /* ── Spacing ─────────────────────────────────── */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 12px;
  --space-lg: 15px;
  --space-xl: 20px;
  --space-2xl: 30px;

  /* ── Radius ──────────────────────────────────── */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 10px;
  --radius-full: 9999px;

  /* ── Shadow ──────────────────────────────────── */
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.05);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.1);
  --shadow-lg: 0 10px 30px rgba(0,0,0,0.15);

  /* ── Typography ──────────────────────────────── */
  --font-family: 'Apple SD Gothic Neo', 'Malgun Gothic', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono:   'SFMono-Regular', Consolas, 'Liberation Mono', monospace;

  --fs-xs:   11px;
  --fs-sm:   12px;
  --fs-base: 13px;
  --fs-lg:   14px;
  --fs-xl:   16px;
  --fs-2xl:  20px;
  --fs-3xl:  24px;

  --fw-normal: 400;
  --fw-medium: 500;
  --fw-bold:   700;
  --fw-black:  800;

  /* ── Controls (버튼/인풋 줄 맞추기) ──────────── */
  --control-height-sm: 28px;
  --control-height:    34px;
  --control-height-lg: 44px;

  /* ── Layout ──────────────────────────────────── */
  --container-max: 1500px;
  --header-height: 60px;

  /* ── Transitions ─────────────────────────────── */
  --t-fast: 0.15s ease;
  --t-base: 0.2s ease;
}