/*
 * 디자인 시스템 원본 토큰 (--il-*)
 * 출처: 디자인 시스템 제공 tokens.css (2026-10-16 수령)
 * - 이 파일의 값은 디자인 시스템 원본이며 직접 수정하지 않는다. 사이트 연결은 design-tokens-v5.css(--ds-*)에서 한다.
 * - 원본의 @font-face(Spoqa Han Sans Neo, .eot 포함)는 디자이너 확인에 따라 제외했다.
 *   서체는 design-tokens-v5.css에 등록된 기존 woff2를 계속 사용한다.
 */

/* =========================================================
   TEXT / TYPOGRAPHY – RAW TOKENS
   ========================================================= */
:root {
  /*Font-family*/
  --il-font-family: 'Spoqa Han Sans Neo', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --il-sidebar-w-collapsed: calc(var(--il-1) * 16);
  --il-sidebar-w-expanded: calc(var(--il-1) * 64);
  /*Font-size*/
  --il-text-size1: 12px; /* cpation font size */
  --il-text-size2: 14px; /* Body Basic font size */
  --il-text-size3: 16px; /* Body large font size */
  --il-text-size4: 18px; /* Title font size */
  --il-text-size5: 24px; /* Large title font size */
  --il-text-size6: 30px; /* Extra large heading font size */
  --il-text-size7: 36px; /* Jumbo heading font size */
  --il-text-size8: 42px; /* Display heading font size */
  --il-text-size9: 48px; /* Hero heading font size */
  /*Font-weight*/
  --il-fw-regular: 400;
  --il-fw-medium: 500;
  --il-fw-semibold: 600;
  --il-fw-bold: 700;
  /*Line-height*/
  --il-lh-tight: 1.2;
  --il-lh-normal: 1.5;
  --il-lh-normal-plus: 1.6;
  --il-lh-normal-xl: 1.75;
}


:root {
  /* ========================= White ========================= */
  --il-white: #FFFFFF;
  /* ========================= Gray ========================= */
  --il-gray-50: #F9F9F9;
  --il-gray-100: #F1F1F1;
  --il-gray-200: #E5E5E5;
  --il-gray-300: #D0D0D0;
  --il-gray-400: #B6B6B6;
  --il-gray-500: #999999;
  --il-gray-600: #898989;
  --il-gray-700: #666666;
  --il-gray-800: #4E4E4E;
  --il-gray-900: #2F3336;
  /* ========================= Primary ========================= */
  --il-primary-50: #FDF3F2;
  --il-primary-100: #F1C2BE;
  --il-primary-200: #E89B94;
  --il-primary-300: #DE7067;
  --il-primary-400: #CE5045;
  --il-primary-500: #AF2E2A;
  --il-primary-600: #8E2421;
  --il-primary-700: #842320;
  --il-primary-800: #5F1917;
  --il-primary-900: #3A100F;
  /* ========================= Danger ========================= */
  --il-danger-50: #FEEDEC;
  --il-danger-100: #FDDBD9;
  --il-danger-200: #FBB8B6;
  --il-danger-300: #F98A89;
  --il-danger-400: #F7354B;
  --il-danger-500: #D1243B;
  --il-danger-600: #AE132C;
  --il-danger-700: #7A0F1E;
  --il-danger-800: #520A12;
  --il-danger-900: #330509;
  /* ========================= Warning ========================= */
  --il-warning-50: #FFF7E2;
  --il-warning-100: #FDE99F;
  --il-warning-200: #FFCA4E;
  --il-warning-300: #F4B800;
  --il-warning-400: #BB8C00;
  --il-warning-500: #956F00;
  --il-warning-600: #826100;
  --il-warning-700: #5D4400;
  --il-warning-800: #3F2D00;
  --il-warning-900: #2D1F00;
  /* ========================= Success ========================= */
  --il-success-50: #F2FAF3;
  --il-success-100: #DCF2DE;
  --il-success-200: #B5E4B8;
  --il-success-300: #87D48B;
  --il-success-400: #5BBF61;
  --il-success-500: #35A33A;
  --il-success-600: #26872A;
  --il-success-700: #1E6222;
  --il-success-800: #16451A;
  --il-success-900: #102D13;
  /* ========================= Information ========================= */
  --il-information-50: #F2F8FC;
  --il-information-100: #DDECF7;
  --il-information-200: #B6D6EC;
  --il-information-300: #80B8DF;
  --il-information-400: #4D9AD0;
  --il-information-500: #247BBD;
  --il-information-600: #17619F;
  --il-information-700: #104B85;
  --il-information-800: #0D3A68;
  --il-information-900: #092849;
  /* ========================= Text ========================= */
  --il-text-primary: #111111;
  --il-text-secondary: #555555;
  --il-text-tertiary: #6b6b6b;
  --il-text-disabled: #999999;
  --il-text-white: #FFFFFF;
  /* Radius */
  --il-r-sm: 4px;
  --il-r-md: 8px;
  --il-r-lg: 12px;
  --il-r-xl: 16px;
  --il-r-2xl: 20px;
  --il-r-max: 999px;
  /* Spacing : gap, margin, padding 등에 사용 */
  --il-0: 0rem; /* 0px */
  --il-1: 0.25rem; /* 4px */
  --il-2: 0.5rem; /* 8px */
  --il-3: 0.75rem; /* 12px */
  --il-4: 1rem; /* 16px */
  --il-5: 1.25rem; /* 20px */
  --il-6: 1.5rem; /* 24px */
  --il-7: 1.75rem; /* 28px */
  --il-8: 2rem; /* 32px */
  --il-9: 2.25rem; /* 36px */
  --il-10: 2.5rem; /* 40px */
  --il-11: 2.75rem; /* 44px */
  --il-12: 3rem; /* 48px */
  --il-13: 5rem; /* 80px */
  --il-14: 11.875rem; /* 190px */
  /* =========================================================
 * il Shadow Tokens
 * ========================================================= */
  /*  Shadow 1  : 기본 카드 */
  --il-shadow-1: 0 1px 3px 0 rgba(0, 0, 0, 0.12);
  /*  Shadow 2 : 드롭다운, 팝오버 */
  --il-shadow-2: 0 3px 12px 0 rgba(0, 0, 0, 0.16);
  /*  Shadow 3 : 모달, 상위 레이어 */
  --il-shadow-3: 0 8px 24px 0 rgba(0, 0, 0, 0.24);
}