/* =============================================================
 * SAM4S Design System — Tokens (Layer 1)
 * Version: 1.0.0
 * Reference: sam4sdm Dashboard image
 *
 * 이 파일은 "의미 있는 이름 : 원시 값" 매핑만 포함한다.
 * 실제 스타일 규칙은 sam4s-components.css 를 참조한다.
 *
 * 사용 원칙
 *   1) 이 파일 밖에서는 절대 #RRGGBB, 원시 px 을 직접 쓰지 않는다.
 *   2) 모든 상위 계층(base, components, patterns, pages)은 var(--token) 만 참조한다.
 *   3) 색/간격/크기를 조정하려면 이 파일만 편집한다.
 * ============================================================= */

:root {
  /* ---------- Brand ---------- */
  --brand-050: #E3EEF9;
  --brand-400: #6F9EDB;
  --brand-500: #3574CC;           /* Primary — TopNav bg, primary button */
  --brand-600: #2A5EA8;           /* hover / pressed */
  --brand-700: #1F4681;

  /* ---------- Semantic ---------- */
  --color-primary:     var(--brand-500);
  --color-on-primary:  #FFFFFF;

  --color-danger:      #D64545;
  --color-danger-bg:   #FDECEC;

  --color-success:     #22C55E;
  --color-success-bg:  #E6F7EC;

  --color-warning:     #E0A030;
  --color-warning-bg:  #FEF3D9;

  --color-info:        #38BDF8;
  --color-info-bg:     #E3F4FC;

  /* ---------- Surface (Light) ---------- */
  --surface-0:         #FFFFFF;   /* card / table / modal */
  --surface-1:         #F2F4F7;   /* page background */
  --surface-2:         #E9ECF1;   /* subtle hover / sunk area */
  --surface-3:         #DEE3EA;

  --border:            #E3E7EC;
  --border-strong:     #C6CCD4;

  --text:              #1F2430;
  --text-muted:        #5B6270;
  --text-placeholder:  #9AA3AD;
  --text-on-dark:      #E6EAEF;
  --text-disabled:     #B8BEC7;

  /* ---------- Navigation (Dark Sidebar) ---------- */
  --nav-bg:            #2D3443;
  --nav-bg-alt:        #262B37;   /* search input background */
  --nav-active-bg:     #1F2532;
  --nav-text:          #C2C8D2;
  --nav-text-strong:   #FFFFFF;
  --nav-accent:        #FFC107;   /* selected 라벨 텍스트 + 좌측 border — 아이콘(_selected.png) 의 노란 톤과 통일 */
  --nav-icon-active:   #FFC107;   /* selected 아이콘(텍스트형 emoji)에 적용할 노란색 — 이미지 아이콘(_selected.png)의 톤과 통일 */
  --nav-divider:       rgba(255, 255, 255, 0.06);

  /* ---------- Stat / Chart ---------- */
  --stat-purple:       #A855F7;   /* Donut All */
  --stat-sky:          #38BDF8;   /* Donut Running */
  --stat-green:        #7DC74C;   /* Donut Idle */
  --stat-gray:         #8492A3;   /* Donut Off */

  --chart-bar:         #93C5FD;
  --chart-line:        #A1372E;

  /* ---------- Status text ---------- */
  --status-success:    #198754;
  --status-danger:     #B91C1C;
  --status-warning:    #A16207;
  --status-muted:      #64748B;

  /* ---------- Spacing (4pt grid) ---------- */
  --space-0:  0;
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;

  /* ---------- Radius ---------- */
  --radius-xs:   2px;
  --radius-sm:   4px;
  --radius-md:   8px;             /* card 기본 */
  --radius-lg:   12px;
  --radius-xl:   16px;
  --radius-pill: 9999px;

  /* ---------- Sizing ---------- */
  --size-topnav:      64px;       /* sam4sdm.com 참조 — 메뉴 라인 + padding 기준 */
  --size-sidebar:     240px;
  --size-control-sm:  32px;
  --size-control-md:  40px;
  --size-control-lg:  48px;
  --size-icon-sm:     16px;
  --size-icon-md:     20px;
  --size-icon-lg:     24px;

  /* ---------- Typography ---------- */
  --font-sans: "Pretendard", "Noto Sans KR", "Malgun Gothic",
               -apple-system, BlinkMacSystemFont, "Helvetica Neue",
               Arial, sans-serif;
  --font-mono: "JetBrains Mono", "Consolas", "Menlo", monospace;

  /* size / line-height pairs */
  --text-xs:   12px;  --lh-xs:   16px;
  --text-sm:   13px;  --lh-sm:   18px;
  --text-base: 14px;  --lh-base: 20px;   /* 본문 기준 */
  --text-md:   15px;  --lh-md:   22px;
  --text-lg:   18px;  --lh-lg:   26px;
  --text-xl:   20px;  --lh-xl:   28px;
  --text-2xl:  24px;  --lh-2xl:  32px;
  --text-3xl:  30px;  --lh-3xl:  36px;
  --text-stat: 44px;  --lh-stat: 48px;   /* 대시보드 큰 숫자 */

  --fw-regular:  400;
  --fw-medium:   500;
  --fw-semibold: 600;
  --fw-bold:     700;

  /* ---------- Elevation (subtle) ---------- */
  --elevation-0: none;
  --elevation-1: 0 1px 2px rgba(17, 24, 39, 0.04),
                 0 1px 1px rgba(17, 24, 39, 0.03);
  --elevation-2: 0 2px 6px rgba(17, 24, 39, 0.06),
                 0 4px 12px rgba(17, 24, 39, 0.06);
  --elevation-3: 0 4px 10px rgba(17, 24, 39, 0.08),
                 0 12px 24px rgba(17, 24, 39, 0.10);
  --elevation-4: 0 10px 20px rgba(17, 24, 39, 0.12),
                 0 20px 40px rgba(17, 24, 39, 0.14);
  --elevation-5: 0 20px 40px rgba(17, 24, 39, 0.18),
                 0 40px 80px rgba(17, 24, 39, 0.22);

  /* ---------- Motion ---------- */
  --motion-fast:  120ms;
  --motion-base:  200ms;
  --motion-slow:  320ms;
  --ease-out:     cubic-bezier(0, 0, 0.2, 1);
  --ease-in-out:  cubic-bezier(0.4, 0, 0.2, 1);
  --ease-in:      cubic-bezier(0.4, 0, 1, 1);

  /* ---------- Z-index stack ---------- */
  --z-sidebar:   10;
  --z-topnav:    20;
  --z-dropdown:  100;
  --z-modal:     1000;
  --z-toast:     1100;
  --z-tooltip:   1200;

  /* ---------- Focus ring ---------- */
  --focus-ring:  0 0 0 3px var(--brand-050);
  --focus-color: var(--brand-500);
}

/* =============================================================
 * Dark mode — SAM4SF 포털은 light-only 운영 정책.
 * OS 다크모드 자동 적용 블록은 의도적으로 비활성화.
 * 향후 다크모드가 필요하면 body[data-theme="dark"] 오버라이드를
 * 명시적으로 되살리면 됨.
 * ============================================================= */

/* =============================================================
 * Reduced motion 사용자 배려
 * ============================================================= */

@media (prefers-reduced-motion: reduce) {
  :root {
    --motion-fast: 0ms;
    --motion-base: 0ms;
    --motion-slow: 0ms;
  }
}