/*
 * 디자인 토큰 (docs/DESIGN.md front matter와 1:1).
 * 값을 바꿀 때는 DESIGN.md를 먼저 고치고 `designmd lint`를 통과시킨 뒤 이 파일에 옮긴다.
 * 이름 규칙: DESIGN.md `colors.primary` -> `--gw-primary`, `spacing.row-height` -> `--gw-row-height`.
 */
:root {
  color-scheme: light;

  /* colors */
  --gw-primary: #2B3A8C;
  --gw-primary-hover: #222F73;
  --gw-primary-subtle: #E8EBF7;
  --gw-secondary: #475569;
  --gw-neutral: #F4F6FA;
  --gw-surface: #FFFFFF;
  --gw-surface-muted: #F8FAFC;
  --gw-on-surface: #0F172A;
  --gw-on-surface-muted: #536175;
  --gw-border: #E2E8F0;
  --gw-border-strong: #CBD5E1;
  --gw-success: #15803D;
  --gw-success-subtle: #DCFCE7;
  --gw-warning: #B45309;
  --gw-warning-subtle: #FEF3C7;
  --gw-error: #B91C1C;
  --gw-error-subtle: #FEE2E2;

  /* 부서 색 팔레트 (DESIGN.md D-12c): 밝은 테마는 흰 글자를 올릴 수 있는 짙은 색 */
  --gw-dept-navy: #1E3A8A;
  --gw-dept-teal: #0F766E;
  --gw-dept-green: #15803D;
  --gw-dept-lime: #4D7C0F;
  --gw-dept-mustard: #A16207;
  --gw-dept-orange: #C2410C;
  --gw-dept-red: #B42318;
  --gw-dept-pink: #BE185D;
  --gw-dept-purple: #7E22CE;
  --gw-dept-gray: #4B5563;
  --gw-dept-on: #FFFFFF;

  /* Bootstrap은 링크·강조 계열 색을 `r, g, b` 값으로 받는다. 위 hex와 같은 색의 파생 표기. */
  --gw-primary-rgb: 43, 58, 140;
  --gw-primary-hover-rgb: 34, 47, 115;
  --gw-on-surface-rgb: 15, 23, 42;
  --gw-neutral-rgb: 244, 246, 250;
  --gw-surface-rgb: 255, 255, 255;

  /* typography */
  --gw-font-family: "Pretendard Variable", Pretendard, "Malgun Gothic", sans-serif;
  --gw-text-body-md: 14px;
  --gw-text-body-sm: 13px;
  --gw-text-label-md: 13px;
  --gw-text-caption: 12px;
  --gw-text-headline-sm: 16px;
  --gw-text-headline-md: 20px;

  /* rounded */
  --gw-rounded-sm: 4px;
  --gw-rounded-md: 8px;
  --gw-rounded-lg: 12px;
  --gw-rounded-full: 9999px;

  /* spacing */
  --gw-space-xs: 4px;
  --gw-space-sm: 8px;
  --gw-space-md: 16px;
  --gw-space-lg: 24px;
  --gw-space-xl: 32px;
  --gw-row-height: 40px;
  --gw-touch-target: 44px;
  --gw-header-height: 48px;
  --gw-sidebar-width: 248px;
  --gw-tabbar-height: 56px;
}

/*
 * 다크 대응 자리 (D-32). 첫 출시는 라이트 전용이라 값이 라이트와 같다.
 * 다크 모드를 구현할 때 이 블록의 색 값만 바꾼다(사용처 변경 없음). 지금은 Deferred.
 */
[data-bs-theme=dark] {
  color-scheme: light;

  --gw-primary: #2B3A8C;
  --gw-primary-hover: #222F73;
  --gw-primary-subtle: #E8EBF7;
  --gw-secondary: #475569;
  --gw-neutral: #F4F6FA;
  --gw-surface: #FFFFFF;
  --gw-surface-muted: #F8FAFC;
  --gw-on-surface: #0F172A;
  --gw-on-surface-muted: #536175;
  --gw-border: #E2E8F0;
  --gw-border-strong: #CBD5E1;
  --gw-success: #15803D;
  --gw-success-subtle: #DCFCE7;
  --gw-warning: #B45309;
  --gw-warning-subtle: #FEF3C7;
  --gw-error: #B91C1C;
  --gw-error-subtle: #FEE2E2;

  /* 부서 색 팔레트: 어두운 테마는 어두운 글자를 올릴 수 있는 옅은 색 */
  --gw-dept-navy: #A5B4FC;
  --gw-dept-teal: #5EEAD4;
  --gw-dept-green: #86EFAC;
  --gw-dept-lime: #BEF264;
  --gw-dept-mustard: #FDE047;
  --gw-dept-orange: #FDBA74;
  --gw-dept-red: #FCA5A5;
  --gw-dept-pink: #F9A8D4;
  --gw-dept-purple: #D8B4FE;
  --gw-dept-gray: #CBD5E1;
  --gw-dept-on: #0F172A;

  --gw-primary-rgb: 43, 58, 140;
  --gw-primary-hover-rgb: 34, 47, 115;
  --gw-on-surface-rgb: 15, 23, 42;
  --gw-neutral-rgb: 244, 246, 250;
  --gw-surface-rgb: 255, 255, 255;
}
