/*
 * ystowel3 디자인 토큰 (Toss Design System 기반)
 * 원본: TDS Mobile / toss.im 검증 토큰 (2026-07-11 캡처)
 * 이 파일은 변수 정의만 담는다 — 실제 적용은 각 CSS에서 var()로 참조.
 */
:root {
  /* 색상 */
  --color-primary: #009bd8;        /* 영신타올 시그니처 블루 (PANTONE 640 CVC) */
  --color-primary-hover: #0087bd;  /* primary 12% 어둡게 */
  --color-on-primary: #ffffff;     /* 파란 버튼 위 텍스트 */
  --color-canvas: #ffffff;         /* 기본 배경 */
  --color-foreground: #191f28;     /* 제목/강조 텍스트 */
  --color-body: #4e5968;           /* 본문 텍스트 */
  --color-muted: #8b95a1;          /* 보조 텍스트 */
  --color-surface: #f2f4f6;        /* 연회색 배경 레이어 */
  --color-border: #e5e8eb;         /* 테두리/구분선 */
  --color-weak-background: #e5f6fd; /* 연파랑 배경 (시그니처 블루 틴트) */
  --color-weak-foreground: #0077a9; /* 연파랑 배경 위 텍스트 */
  --color-danger: #e42939;         /* 오류/삭제 */

  /* 폰트 — Toss Product Sans는 재배포 불가, Pretendard로 대체 예정.
     Pretendard 로드 전까지는 기존 Noto Sans로 폴백된다. */
  --font-sans: 'Pretendard Variable', Pretendard, 'Noto Sans', 'Malgun Gothic', sans-serif;

  /* 타이포그래피 */
  --type-h1-size: 36px;  --type-h1-weight: 700; --type-h1-line-height: 54px;
  --type-h2-size: 30px;  --type-h2-weight: 600; --type-h2-line-height: 45px;
  --type-h3-size: 24px;  --type-h3-weight: 600; --type-h3-line-height: 36px;
  --type-h4-size: 22px;  --type-h4-weight: 600; --type-h4-line-height: 33px;
  --type-body-size: 16px;       --type-body-weight: 400;       --type-body-line-height: 24px;
  --type-body-small-size: 14px; --type-body-small-weight: 400; --type-body-small-line-height: 21px;

  /* 간격 */
  --space-xs: 4px;
  --space-sm: 6px;
  --space-md: 8px;
  --space-lg: 16px;
  --space-xl: 24px;
  --space-xxl: 32px;

  /* 라운드 */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-button-small: 8px;
  --radius-button-medium: 10px;
  --radius-button-large: 14px;
  --radius-button-xlarge: 16px;
}
